/* 
MorwebCMS
Trend | Green Skin Template 2014
http://www.morwebcms.com
*/


@media (min-width: 481px) and (max-width: 979px) {
	
/* ----- Global Wraps ----- */
.headerWrap.stuck { position: relative; }
.header { width: 90%; }
.mainContentArea { width: 90%; }
.toTop { width: 90%; }
.footer { width: 90%; }
#mobile-header { display: none; position: absolute; top: 10px; right: 0px; }

/* ----- socialMedia ----- */
.socialMedia { display: none; margin: 26px 80px 0 0; }
.socialMedia ul li a { margin: 0 5px 0 0; font-size: 12pt; }
.socialMediaWrap { display: none; }
.searchWrap, .searchIcon { display: none; }

/* ----- Mobile Menu ----- */
#mobile-header { display: block; }
nav.mainMenu { display: none; }

/* ----- Logo ----- */
.logo h1 { font-size: 27pt; }

/* ----- Slider ----- */
.centered-btns_nav { height: 84px; width: 65px; background: transparent url("../images/slider-nav-small.png") no-repeat left top; margin-top: -45px; }
.caption { top: 20%; }
.caption h2:before { display: none; }
.caption h2:after { display: none; }
.caption h2 { }
.caption p { color: #fff; line-height: auto; }

.mainContentArea .testimonialgallery p:before {display:none;}
.mainContentArea .testimonialgallery p:after {display:none;}

/* ----- Blog Carousel ----- 
.blogCarousel .viewport { float: none; width: 600px; margin: 0 auto; }
.blogCarousel .buttons { display: none; }
*/
/* ----- Blog Post ----- */
.blogPostWrap { background: none; }
.blogPostWrap:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
.blogPostLeft { float: none; width: 100%; padding-right: 0; min-height: 200px; }
.blogPostRight { float: none; width: 100%; margin-top: 60px; }
.blogPostAuthor { display: none; }
a.readMore { float: none; }

/* ----- Blog Post List ----- */
.postImage { width: 50%; }
.postCopy { width: 45%; }

/* ----- Wide Banner Text Fixes ----- */
.wideBannerCaption h2 { width: 100%; position: relative; }
.bannerImageCaption { top: 24%; width: 80%; left: 10%; right: 10%;}
.bannerImageCaption h1 { }
.bannerImageCaption p { }
.bannerImageCaption h1:before, .bannerImageCaption h1:after { display: none; }

/* ----- threeColumn Block  ----- */
.threeColumnLeft { width: 100%; float: none; margin-right: 0; }
.threeColumnMiddle { width: 100%; float: none; margin-right: 0; }
.threeColumnRight { width: 100%; float: none; margin-right: 0; }

/* ----- twoColumn Block  ----- */
.twoColumnLeft, .twoColumnRight { width: 100%; float: none; }

/* ----- Content Column Clears ----- */
.mwPageArea .Content.Float { width: 100% !important; }
.postGrid { width: 100%; float: none; margin: 10px auto; height: auto; padding-bottom: 10px; }
.postGridImage { width: 100%; }
.post-entry .shareButton { display: none; }

/* ----- Wide Background ----- */
.wideBackground img { display: none; }
.wideBackgroundCopy { width: 90%; top: 10%; left: 0%; right: 0%; }

/* ----- Call To Action ----- */
.callLeft { float: none; width: 100%; padding: 20px 0; margin: 0; }
.callRight { float: none; width: 100%; padding: 5px 0; margin: 0; }
.callLeft p { padding: 0 20px; line-height: 15pt; }

/* -----  Sub Footer ----- */
.subFooterWrap { }
.subFooterWrap .mwPageArea { padding: 0 40px; }
.subFooterLeft { background: #85c98b; }
.subFooterLeft, .subFooterMiddle, .subFooterRight { width: 100%; margin: 0 auto; float: none; padding: 25px 0px; height: auto; }
}




 @media (max-width: 480px) {
	 
/* ----- Global Wraps ----- */
.headerWrap.stuck { position: relative; }
.header { width: 90%; }
.mainContentArea { width: 90%; }
.toTop { width: 90%; }
.footer { width: 90%; }
.searchWrap, .searchIcon { display: none; }
.socialMediaWrap { display: none; }

/* ----- socialMedia ----- */
.socialMedia { display: none; }

/* ----- Mobile Menu ----- */
#mobile-header { display: block; }
nav.mainMenu { display: none; }

/* ----- Logo ----- */
.logo h1 { font-size: 22pt; }
.logoImage {background-size: 100% !important; /*width: 100px !important;*/}

/* ----- Slider ----- */
.banner .item {height:350px;}
.sliderImage {height:350px !important;}
.centered-btns_nav { height: 84px; width: 65px; background: transparent url("../images/slider-nav-small.png") no-repeat left top; margin-top: -45px; }
.caption { top: 30%; left: 15%;right: 15%;width: 70%;}
.caption.boxed { }
.caption.boxed h2 { font-size: 1.8em; }
.caption.boxed h3 { font-size: 1.7em; }
.caption.boxed h4 { font-size: 1.6em; }
.caption.boxed h5 { font-size: 1.5em; }
.caption.boxed p { font-size: 1.4em; }
.caption h2:before { display: none; }
.caption h2:after { display: none; }
.caption h2 { font-size: 1.5em; }
.caption p { color: #fff; font-size: 1.0em; line-height: auto; margin-bottom: 10px;}


.mainContentArea .testimonialgallery p:before {display:none;}
.mainContentArea .testimonialgallery p:after {display:none;}

/* ----- Blog Carousel ----- 
.blogCarousel .viewport { float: none; width: 300px; margin: 0 auto; }
.blogCarousel .buttons { display: none; }
*/
/* ----- Blog Post ----- */
.blogPostWrap { background: none; }
.blogPostWrap:after { clear: both; content: "."; display: block; height: 0; visibility: hidden; }
.blogPostLeft { float: none; width: 100%; padding-right: 0; min-height: 200px; }
.blogPostRight { float: none; width: 100%; margin-top: 60px; }
.blogPostAuthor { display: none; }
a.readMore { float: none; }

/* ----- Blog Post List ----- */
.postImage { width: 100%; float: none; }
.postCopy { width: 100%; float: none; }

/* ----- Wide Banner Text Fixes ----- */
.wideBannerCaption h2 { width: 100%; position: relative; }
.bannerImageCaption { top: 24%; width: 80%;left: 10%; right: 10%;}
.bannerImageCaption h1 { font-size: 2em; }
.bannerImageCaption p { font-size: 1.2em; line-height: 1.2em; }
.bannerImageCaption h1:before, .bannerImageCaption h1:after { display: none; }

/* ----- Content Column Clears ----- */
.mwPageArea .Content.Float { width: 100% !important; }

/* ----- Extras ----- */
.mainContentArea blockquote { margin: 10px 20px; padding: 0px; font-size: 13pt; }
.mainContentArea blockquote:before, .mainContentArea blockquote:after { display: none; }

/* ----- threeColumn Block  ----- */
.threeColumnLeft { width: 100%; float: none; margin-right: 0; }
.threeColumnMiddle { width: 100%; float: none; margin-right: 0; }
.threeColumnRight { width: 100%; float: none; margin-right: 0; }

/* ----- twoColumn Block  ----- */
.twoColumnLeft, .twoColumnRight { width: 100%; float: none; }
.postGrid { width: 100%; float: none; margin: 10px auto; height: auto; padding-bottom: 10px; }
.postGridImage { width: 100%; }
.post-entry .shareButton { display: none; }

/* ----- Wide Background ----- */
.wideBackground img { display: none; }
.wideBackgroundCopy { width: 90%; top: 0%; left: 0%; right: 0%; }

/* ----- Call To Action ----- */
.callLeft { float: none; width: 100%; padding: 20px 0; margin: 0; }
.callRight { float: none; width: 100%; padding: 5px 0; margin: 0; }
.callLeft p { padding: 0 20px; line-height: 15pt; }

/* -----  Sub Footer ----- */
.subFooterWrap {  }
.subFooterWrap .mwPageArea { padding: 0 20px; }
.subFooterLeft { background: #85c98b; }
.subFooterLeft, .subFooterMiddle, .subFooterRight { width: 100%; margin: 0 auto; float: none; padding: 25px 0px; height: auto; }
.bannerImage, .bannerImageHolder { height: 200px !important; }

.portfolioImage {width:300px !important;}
}