/* Reference - http://css-tricks.com/snippets/css/media-queries-for-standard-devices/ */

/* Useful only to simulate stretched layout. Will switch to auto in other media formats */

#box-wrap,
.boxed #container-wrap {
    width: 960px; /* extra width required for 3d slider */;
}

#slider-wrap {
	width:940px;
	}


.layout-1c #content,
#homepage-wrap #content {
    width: 960px;
}


img.dummy-img {
    visibility: hidden;
}

#responsive-primary-menu {
    display: none;
}

.responsive audio {
    max-width: 100%;
}

.responsive video {
    width: 100% !important;
    height: auto !important;
}

/* ================================================== Media Queries ================================================== */

/* Desktops and laptops ----------- */
@media only screen and (min-width : 1152px) {
    #box-wrap,
    .boxed #container-wrap {
	width: 960px;
    }
	
	#header,
	#header-area,
	#header-area-wrap,
	#primary-menu,
	#bottom-area,
	#bottom-area-wrap,
	#sidebars-footer,
	#footer-wrap,
	#footer {
    width: 960px;
}

	#header-search {
	margin-top:130px;
	}
	
	#before-content-area,
	#before-content-wrap{
	width:950px;
	}
	
	#showcase-area, .layout-1c #content, #homepage-wrap #content {
	width:940px;
	}
	
	#slider-wrap {
	width:940px;
	}
	

	
	
	h2.flex2-slide-header  { 
	font-size:24px;
	line-height: 32px;
}
}

/* -------------------------- Small screens -------------------------------------- */

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

    /* Styles */
     .responsive #box-wrap,
    .responsive .boxed #container-wrap {
        width: 960px; /* extra width required for 3d slider */;
    }
	
	.responsive #slider-wrap{
	width:940px;
	}
	
	.responsive #header,
	.responsive #header-area,
	.responsive #header-area-wrap,
	.responsive #primary-menu,
	.responsive #bottom-area,
	.responsive #bottom-area-wrap,
	.responsive #sidebars-footer,
	.responsive #footer-wrap,
	.responsive #footer
	{
    width: 	960px;
}

	.responsive #before-content-area,
	.responsive #before-content-wrap {
	width:950px;
	}

	.responsive #showcase-area, .layout-1c #content, #homepage-wrap #content {
	width:940px;
	}
	
	.responsive #header-search {
	margin-top:130px;
	}

    .responsive .fancy-box-frame {
        max-width: 180px;
        margin: 0 auto;
    }

    .responsive .box-frame, .responsive .box-frame2 {
        max-width: 280px;
        margin: 0 auto;
    }

    .responsive #thumbnail-slider img {
        height: auto !important;
    }
	
	.responsive h2.flex2-slide-header  {
	font-size:24px;
	line-height: 32px;
}

}

/* -------------------------------------- Smaller than standard 960 (devices and browsers) -------------------------------------- */
@media only screen and (max-width: 959px) {

    /* --------------------- Disable non-responsive sliders for devices with smaller screens -------------------*/

    .responsive #accordion-slider-wrapper, .responsive #nivo-slider-wrapper, .responsive #piecemaker-slider-wrap, .responsive #anything-slider-wrapper, .responsive #cycle1-slider-wrapper {
        display: none;
    }
	
	
	.responsive #slider-wrap,
    .responsive #box-wrap,
    .responsive.boxed #container-wrap {
	width: auto;
    }
	
	.responsive #header,
	.responsive #header-area,
	.responsive #header-area-wrap,
	.responsive #before-content-area,
	.responsive #before-content-wrap,
	.responsive #bottom-area,
	.responsive #bottom-area-wrap,
	.responsive #sidebars-footer,
	.responsive #footer-wrap,
	.responsive #footer,
	.responsive #main{
    width: auto;
}

	

	

	
	.responsive #showcase-area .slider-layout-1c {
	width:auto;
	}
	
	.responsive #header-search {
	margin-top:100px;
	
	}
	
	.responsive .menu-container, .responsive #main-primary-menu {
		width:auto;
	}
	

	 .responsive #showcase-area {
	width: auto;
	}
	
	

	.responsive h2.flex2-slide-header   {
	font-size:24px;
	line-height: 24px;
	}
}

/* --------------------------------------Tablet Portrait size to standard 960 (devices and browsers)-------------------------------------- */
@media only screen and (min-width: 768px) and (max-width: 959px) {

    .responsive #slider-wrap,
    .responsive #box-wrap,
    .responsive.boxed #container-wrap {
        width: auto;
    }

    .responsive #content {
        width: 500px;
    }

    .responsive .sidebar-right-nav, .responsive .sidebar-left-nav {
        width: 208px;
    }

    .responsive.layout-3c-r .sidebar-left-nav, .responsive.layout-3c-l .sidebar-right-nav {
        width: 185px !important;
    }

    .responsive.layout-3c-r #content, .responsive.layout-3c-l #content {
        width: 523px !important;
        margin: 0;
    }

    .responsive.layout-3c-c .sidebar-left-nav,
    .responsive.layout-3c-c .sidebar-right-nav,
    .responsive.layout-3c-c #sidebar-primary,
    .responsive.layout-3c-c #sidebar-secondary {
        width: 155px !important;
    }

    .responsive.layout-3c-c #content {
        width: 355px;
        right: -180px;
    }

    .responsive.layout-3c-c .sidebar-left-nav {
        right: 390px;
    }

    .responsive.layout-1c #content,
    .responsive #homepage-wrap #content,
	 .responsive #showcase-area  {
        width: auto;
    }

    .responsive #header,
	.responsive #header-area,
	.responsive #header-area-wrap,
	.responsive #before-content-area,
	.responsive #before-content-wrap,
	.responsive #bottom-area,
	.responsive #bottom-area-wrap,
	.responsive #sidebars-footer,
	.responsive #footer-wrap,
	.responsive #footer,
	.responsive #main,
    .responsive #flex-slider2-wrapper .flexslider,
    .responsive #flex-slider-wrapper .flexslider {
        width: auto;
    }
	
	
	
	.responsive .menu-container, .responsive #main-primary-menu {
		width:auto;
	}

	.responsive #header-search {
	margin-top:100px;
	}

    .responsive .flexslider .flex2-slide-header,  {
        font-size: 38px;
		
	}
	
	.responsive h2.flex2-slide-header  {
	font-size:18px;
	line-height: 16px;
	}

    .responsive.layout-2c .thumbnail-list .entry-text-wrap {
        width: 270px;
    }

    .responsive .fancy-box-frame {
        padding: 6px;
    }
	

}

/* --------------------------------------All Mobile Sizes (devices and browser)-------------------------------------- */
@media only screen and (max-width: 767px) {

    h1, h2, h3 {
        line-height: 32px;
        margin-bottom: 15px;
    }

    h1 {
        font-size: 28px;
    }

    h2 {
        font-size: 26px;
    }

    h3 {
        font-size: 22px;
    }

    .responsive #slider-wrap,
    .responsive #box-wrap,
    .responsive.boxed #container-wrap,
	.responsive #bottom-area-wrap,
	.responsive #sidebars-footer,
	.responsive #footer-wrap,
	{
        width: auto;
    }

    .responsive.layout-1c #content,
    .responsive.layout-3c-l #content,
    .responsive #content,
    .responsive #homepage-wrap #content {
        width: auto !important;
    }

    .responsive #header,
	.responsive #header-area,
	.responsive #header-area-wrap,
	.responsive #before-content-area,
	.responsive #before-content-wrap,
	.responsive #bottom-area,,
	.responsive #footer,
	.responsive #main,
    .responsive #flex-slider2-wrapper .flexslider,
    .responsive #flex-slider-wrapper .flexslider {
	width: auto;
    }
	
	
	.responsive .menu-container, .responsive #main-primary-menu {
		width:auto;
	}
	
	.responsive #header-search {
	margin-top:130px;
	}


    .responsive .one-sixth,
    .responsive .one-fifth,
    .responsive .one-fourth,
    .responsive .one-third,
    .responsive .two_fifth,
    .responsive .one-half,
    .responsive .two-sixth,
    .responsive .three-sixth,
    .responsive .four-sixth,
    .responsive .five-sixth,
    .responsive .two-fifth,
    .responsive .three-fifth,
    .responsive .four-fifth,
    .responsive .two-fourth,
    .responsive .three-fourth,
    .responsive .two-third {
        margin: 0 0 25px 0;
        width: 280px;
        max-width: 100%; /* With padding applied on the left and right, this piece can overflow */
    }

    .responsive .sidebar-right-nav, .responsive .sidebar-left-nav, .responsive .sidebar-right-nav .sidebar-bottom, .responsive .sidebar-left-nav .sidebar-bottom, .responsive .sidebar-right-nav .sidebar-top, .responsive .sidebar-left-nav .sidebar-top {
        background: none;
    }

    .responsive #content, .responsive .sidebar-left-nav, .responsive .sidebar-right-nav {
        float: none !important;
        padding: 20px 0 !important;
        clear: both;
    }

    .responsive.layout-3c .sidebar-right-nav, .responsive.layout-3c .sidebar-left-nav,
    .responsive.layout-3c #sidebar-primary, .responsive.layout-3c #sidebar-secondary {
        width: 280px !important;
    }

    .responsive #sidebar-after-singular .widget {
        width: 280px !important;
        float: none;
        margin: 0 0 25px 0;
    }

    .responsive.layout-3c #sidebar-primary,
    .responsive.layout-3c #sidebar-secondary {
        float: none;
        padding: 0;
    }

    .responsive.layout-3c-c #content {
        right: 0;
    }

    .responsive #content.grid-list .hentry {
        margin-bottom: 40px;
    }

    .responsive.layout-3c-c .sidebar-left-nav {
        right: 0;
    }

    .responsive #content .image-container {
        float: none;
    }

    /* Do not disturb the post lists */
    .responsive ul.post-list .image-container, .responsive #content ul.post-list .image-container {
        float: left !important;
    }

    .responsive #content .image-container img {
        width: 100% !important;
    }

    .responsive #main-primary-menu {
        display: none;
    }
	
	.responsive .menu-container{
		background:none;
	}

    .responsive #responsive-primary-menu {
        display: block;
        position: relative;
        bottom: 0;
        padding: 5px 0;
        border-bottom: 1px solid #ddd;
        background: #158ECF;
    }

    .responsive .responsive-menu-wrap {
		width:auto;
	
    }

    .responsive #responsive-select-menu {
        display: block;
        outline: none;
        width: 300px;
        border: 1px solid #dddddd;
        padding: 5px;
        margin: 0 auto;
        max-width: 85%;
        font-family: inherit;
        color: inherit;
        background-image: url(../images/select.png);
        background-position: center right;
        background-repeat: no-repeat;
        background-color: white;
        border-radius: 3px;
        -webkit-appearance: none;
        -moz-appearance: none;
        appearance: none;
        height: 30px;
        line-height: 16px;
    }

    .responsive .box-frame, .responsive .box-frame2, .responsive .fancy-box-frame {
        margin-bottom: 15px;
    }

    .responsive .slogan1, .responsive .slogan2 {
        padding: 15px 25px;
    }

    .responsive #portfolio-template .hfeed .clear, .responsive #portfolio-full-width .hfeed .clear {
        padding: 0;
    }

    .responsive #portfolio-template .one-half, .responsive #portfolio-full-width .one-half, .responsive #portfolio-template .one-third, .responsive #portfolio-full-width .one-third, .responsive #portfolio-template .one-fourth, .responsive #portfolio-full-width .one-fourth {
        padding: 15px 0;
    }

    .responsive .carouselslider-container .entry-summary {
        display: none;
    }

    .responsive .carouselslider-container .flexslider .slides .image-frame {
        padding: 2px;
    }

    .responsive .flexslider .flex2-html-caption {
        top: 5px;
    }

    .responsive .flexslider .flex2-slide-header {
        font-size: 18px !important;
        width: 150px;
    }
	
	.responsive h2.flex2-slide-header {
	font-size:18px;
	line-height::16px;
	}

    .responsive .flexslider .flex2-html-caption .flex2-summary {
        display: none !important;
    }

    .responsive #sidebar-before-content-home .widget h3 {
        border-right: none !important;
    }

    .responsive .quote-wrap.alignright, .responsive .quote-wrap.alignleft {
        width: 180px;
    }

    .responsive .pullquote, .responsive blockquote {
        font-size: 14px !important;
    }

    .responsive .quote-wrap.alignright, .responsive blockquote.alignright {
        margin-left: 15px;
    }

    .responsive .quote-wrap.alignleft, .responsive blockquote.alignleft {
        margin-right: 15px;
    }

    .responsive .flex-caption .flex-summary {
        display: none;
    }

    /* Caption styles */
    .responsive .flex-caption {
        left: 0;
        bottom: 0;
        width: 100%;
        padding: 5px 10px 5px 10px;
        box-sizing: border-box;
        -moz-box-sizing: border-box;
        -webkit-box-sizing: border-box;
    }

    .responsive .flex-caption a {
        font-size: 16px;
    }

    .responsive.layout-1c #commentform textarea {
        width: 80%;
    }

    .responsive.layout-2c .thumbnail-list .entry-text-wrap {
        width: 100%;
    }

    .responsive .thumbnail-list .image-container {
        width: 100%;
    }

    .responsive ul.image-grid li {
        width: 280px;
        height: auto;
        margin: 0 0 20px 0;
    }

}

/* --------------------------------------Mobile Landscape Size to Tablet Portrait (devices and browsers)-------------------------------------- */
@media only screen and (min-width: 480px) and (max-width: 767px) {

    .responsive #slider-wrap,
    .responsive #box-wrap,
    .responsive.boxed #container-wrap {
        width: auto;
    }

    .responsive.layout-1c #content,
    .responsive.layout-3c-l #content,
    .responsive #content,
    .responsive #homepage-wrap #content {
        width: auto !important;
    }

    .responsive #header,
	.responsive #header-area,
	.responsive #header-area-wrap,S
    .responsive #before-content-area,
	.responsive #before-content-wrap,
	.responsive #bottom-area,
	.responsive #bottom-area-wrap,
	.responsive #sidebars-footer,
	.responsive #footer-wrap,
	.responsive #footer,
	.responsive #main,
	.responsive #content
    .responsive #flex-slider2-wrapper .flexslider,
    .responsive #flex-slider-wrapper .flexslider,
	.responsive #menu-wrap,
	.responsive #primary-menu .menu-container
	 {
        width: auto;
    }
	
	.responsive .menu-container, .responsive #main-primary-menu {
		width:auto;
	}
	

	 .responsive #showcase-area {
		width: auto;
	}
	
	 .responsive.layout-1c #content,
    .responsive #homepage-wrap #content {
        width: auto;
    }
	

    .responsive .one-fifth,
    .responsive .one-fourth,
    .responsive .one-third,
    .responsive .two_fifth,
    .responsive .one-half,
    .responsive .three-fifth,
    .responsive .two-third,
    .responsive .three-fourth,
    .responsive .four-fifth,
	.responsive .one-third last-column,
	.responsive .one-fourth last-column {
        width: 420px;
		float:none;
		margin:auto;
    }

    .responsive ul.image-grid li {
        width: 420px;
        height: auto;
        margin: 0 0 20px 0;
    }

    .responsive .flexslider .flex2-html-caption {
        top: 20px;
    }

    .responsive .flexslider .flex2-slide-header {
        font-size: 20px !important;
        width: 180px;
	
    }
	
	.responsive h2.flex2-slide-header {
	font-size:16px;
	line-height::16px;
	}

    .responsive blockquote.alignleft, .responsive blockquote.alignright {
        width: 200px;
        padding: 5px 5px 5px 42px;
    }

}

/* --------------------------------------Mobile Portrait Size to Mobile Landscape Size (devices and browsers) --------------------------------------*/
@media only screen and (max-width: 479px) {
  .responsive #slider-wrap,
    .responsive #box-wrap,
    .responsive.boxed #container-wrap {
        width: auto;
    }

    .responsive.layout-1c #content,
    .responsive.layout-3c-l #content,
    .responsive #content,
    .responsive #homepage-wrap #content {
        width: auto !important;
	
    }

    .responsive #header,
	.responsive #header-area,
	.responsive #header-area-wrap,S
    .responsive #before-content-area,
	.responsive #before-content-wrap,
	.responsive #bottom-area,
	.responsive #bottom-area-wrap,
	.responsive #sidebars-footer,
	.responsive #footer-wrap,
	.responsive #footer,
	.responsive #main,
	.responsive #content
    .responsive #flex-slider2-wrapper .flexslider,
    .responsive #flex-slider-wrapper .flexslider,
	.responsive #menu-wrap,
	.responsive #primary-menu .menu-container
	 {
        width: auto;
    }
	
	.responsive .menu-container, .responsive #main-primary-menu {
		width:auto;
	}
	

	 .responsive #showcase-area {
		width: auto;
	}
	
	 .responsive.layout-1c #content,
    .responsive #homepage-wrap #content {
        width: auto;
    }

	.responsive .one-fifth,
    .responsive .one-fourth,
    .responsive .one-third,
    .responsive .two_fifth,
    .responsive .one-half,
    .responsive .three-fifth,
    .responsive .two-third,
    .responsive .three-fourth,
    .responsive .four-fifth {
        width:280px;
		margin:auto;
		float:none;
	

    }


    .responsive #header-area-wrap {
        text-align: center;
    }
	
	

    .responsive #header-logo, .responsive #social-container {
        position: relative;
        top: 15px;
    }

    .responsive #site-title a, .responsive #social-container {
        display: inline-block;
        text-align: center;
    }

    .responsive #menu-footer {
        float: none;
    }

    .responsive .image-wrapper.alignleft, .responsive .image-wrapper.alignright {
        float: none;
        margin: 0;
    }

    .responsive .contact-form textarea {
        width: 100%;
    }
	
	.responsive #header-search {
	float:none;
	display:inline-block;
	margin:0 auto;
	text-align: center;
	height:25px;
	}

	.responsive #header-search p {
	margin-top:5px;
	}
	
	

	

}

/* -------------------------------------- prettyPhoto styling for small screens --------------------------------------*/

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

    .pp_pic_holder.pp_default { width: 100% !important; left: 0 !important; overflow: hidden; }

    div.pp_default .pp_content_container .pp_left { padding-left: 0 !important; }

    div.pp_default .pp_content_container .pp_right { padding-right: 0 !important; }

    .pp_content { width: 100% !important; height: auto !important; }

    .pp_fade { width: 100% !important; height: 100% !important; }

    a.pp_expand, a.pp_contract, .pp_hoverContainer, .pp_gallery, .pp_top, .pp_bottom { display: none !important; }

    #pp_full_res img { width: 100% !important; height: auto !important; }

    .pp_details { width: 94% !important; padding-left: 3%; padding-right: 4%; padding-top: 10px; padding-bottom: 10px; background-color: #fff; margin-top: -2px !important; }

    a.pp_close { right: 10px !important; top: 10px !important; }

}