/*-----------------------------------------------------------------------------------

	Theme Name: Advoacte
	Author: Two2Twelve Themes
	Author URI: http://themes.two2twelve.com
	Version: 1.0
	
	Stylesheet: Media Queries

	0.	CSS Reset 
	1.	Global (body, page sructure, common classes)
	2.  Header and Navigation
	3.  Homepage
	4.  Blog
	5.  Gallery
	6.  Contact
	7.  Donate
	8.  Widgets
	9.  Footer
	10. Typography
	11. Buttons
	12. Lists
	13. Forms
	14. Icons
	15. Events List
	16. Event Description
	17. About

-----------------------------------------------------------------------------------*/

/* For iPads and Tablets */
@media screen and (min-width: 751px) and (max-width: 970px) {

    /* 1. Global */
    .container {
        width: 768px;
        margin: 0 auto;
    }

    section.page_heading.others {

        position: absolute;
        top: 65px;
        height: 118px;
        border: 0px dashed orange;
    }

    section.page_heading .logo a {
        font-size: 33px;
        font-family: 'Roboto Condensed';
        position: absolute;
        top: 16px;
        left: 47px;
    }

    section.page_heading .logo .tagline {
        font-size: 17px;
        line-height: 21px;
        font-family: 'Georgia';
        font-style: italic;
        position: absolute;
        top: 34px;
        left: 136px;
        white-space: nowrap;
    }

    .logo img#ihc-logo {
        display: inline;
        box-shadow: 3px 3px 6px rgba(0, 0, 0, 0.5);
        margin-right: 2em;
        margin-bottom: 1em;
        width: 195px !Important;
        float: right;
        z-index: 1000;
    }

    div.flexslider-container img#ihclogo {
        float: right;
        z-index: 5000;
        max-width: 185px;
        min-width: 145px;
        /*height: auto;*/
        width: 25%;
        box-shadow: 3px 4px 3px rgba(0, 0, 0, 0.5);
        position: absolute;
        margin-right: 5px;
        left: 68.0%;
        top: 9.5%;
    }

    /* 2. Header and Navigation */
    header nav ul li {
        margin-right: 5px;
    }

    /* 3. Homepage */
    div#home div#slider img {
        width: 100%;
    }

    div#revolution_wrap div#description {
        width: 100%;
        text-align: center;
        margin-bottom: 10px;
    }

    div#actions span.icon {
        margin-left: 2px;
    }

    div#revolution_wrap div#actions {
        float: left;
        width: 100%;
    }

    div#revolution_wrap div#actions div.one_half {
        margin-bottom: 10px;
    }

    div.sub_heading, div.box_heading {
        margin-bottom: 20px;
    }

    div#help {
        margin-bottom: 22px;
    }

    div#help .text {
        margin-left: 55px;
    }

    .donate_button {
        padding: 8px 16px;
    }

    div#items div.one_third {
        width: 46%;
    }

    div#items div.news {
        margin-right: 8%;
    }

    div#items div.news ul li {
        margin-bottom: 12px;
    }

    div#items div.events {
        margin-right: 0 !important;
    }

    div#items div#sponsors {
        width: 100%;
        text-align: center;
    }

    div#items div#sponsors img {

    }

    div#items div#sponsors ul {
        width: 724px;
    }

    div#items div#sponsors ul li {
        padding: 5px 21px 3px;
        border-right: none;
        background: #f9f9f9;
        display: inline-block;
        border-bottom: none;
        width: 137px;
    }

    div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails img,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails img {
        width: 100%;
        height: 100%;
    }

    /*div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails img  {
        width: 100%;
        height: 100%;
    }	*/
    div.page_wrapper section.container div#gallery.page, div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.two_column, div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.three_column, div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.four_column {
        width: 742px;
    }

    div.page_wrapper2 section.container div#gallery.page, div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.two_column, div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.three_column, div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.four_column {
        width: 742px;
    }

    div.page_wrapper section.container div#gallery ul li,
    div.page_wrapper2 section.container div#gallery ul li {
        margin-bottom: 11px;
    }

    div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.two_column li,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.two_column li {
        width: 361px;
        height: 255px;
    }

    div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.three_column li,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.three_column li {
        width: 237px;
        height: 168px;
    }

    div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.four_column li,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.four_column li {
        width: 175px;
        height: 124px;
    }

    /*div.page_wrapper section.container div#gallery.page.with_sidebar, div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails.two_column, div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails.three_column, div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails.four_column {
        width: 488px;
    }
    div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails.two_column li {
        width: 234px;
        height: 165px;
    }
    div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails.three_column li {
        width: 152px;
        height: 107px;
    }
    div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails.four_column li {
        width: 112px;
        height: 79px;
    }*/
    div.three_fourths {
        max-width: 600px;
        width: 104%;
        padding: .3em 0 .5em 0.2em;
        margin: 1em auto .0em auto;
        background: #f0eee0;
        border: 4px double #DFDBC4;
        font-size: 1.0em;
        color: #444
    }

    div.three_fourths table.one,
    div.three_fourths table.two {
        width: 40%;
    }

    div.three_fourths table.one {
        margin-left: 1.6em;
    }

    div.three_fourths table.two {
        float: right;
    }

    div.three_fourths table.one td p.book1,
    div.three_fourths table.one td p.book2,
    div.three_fourths table.one td p.book3,
    div.three_fourths table.one td p.book4 {
        width: 102%;
        font-size: 95%;
        margin-left: 24px;
    }

    div.three_4ths {
        min-width: 650px;
        width: 90%;
        margin: .5% auto;
        padding: .5em 0;
    }

    h1.showcase {
        white-space: nowrap;
    }

    /*div.three_fourths table.one td p.book3,
    div.three_fourths table.one td p.book4 {width: 45%;}
    div.three_fourths table.one td p.book3 {margin: 0 4px;}
    div.three_fourths table.one td p.book4 { margin: 3px;}*/
    /* Recent Projects*/
    div#events_tours div.tours div.tour_details2 { /* RECENT PROJECTS AND WHAT'S NEW HOLLAND, SWISS, ETC. */
        float: right;
        width: 62%;
        margin: 12px 10px 12px 0;
        border: 0px dashed blue;
    }

    div.tours div.tour_pix2 {
        float: left;
        width: 32%;
        max-width: 310px;
        height: auto;
        margin-top: 3%;
        margin-left: 1em;
        overflow: hidden;
    }

    div.tours div.tour_pix2 img {
        width: 100%;
        display: inline-block;
        border: 1px solid #000;
        margin: 1px auto;
        text-align: center;
    }

    /* 6. Contact */
    div#contact {
        width: 94%;
    }

    div#contact .three_4ths p, div#contact .three_4ths p.addy {
        font-size: .9em;
        line-height: 20px;
        color: #555;
        padding-right: .3em;
        margin: 0 0 .1em 0;
    }

    /* {width: 70%; background: url('../images/usmap3.png') top left no-repeat #f5f5eb;}

    background-size: cover;
     background-image: url('../images/usmap3.png');
     height: 100vh; }*/
    div.indy ul#map {
        width: 100vw;
    }

    .viewport-1 {
        float: left;
        background-size: cover;
        background-image: url('../images/usmap3.png');
        width: 100vw;
        height: 100vh;
    }

    div#contact div#location div.one_fourth.column_last {
        width: 100%;
        margin-top: 12px;
    }

    div#contact div.row {
        width: 477px;
    }

    div#contact div.row select {
        margin-bottom: 25px;
    }

    /* 7. Donate */
    div#donate {
        width: 62%;
    }

    div#donate h1 {
        margin-bottom: 16px;
    }

    div#donation_level {
        margin-top: 30px;
    }

    div#donation_level p {
        width: 100%;
    }

    div#donation_level ul.amount {
        float: left;
        margin-top: 12px;
    }

    div#donation_level ul.amount li a {
        margin-right: 10px;
    }

    /* 15. Events List */
    div#events_list div.list div.event_details {
        width: 57%;
    }

    div#events_list div.list div.event_date {
        width: 35%;
    }

    /* 16. Event Description */
    div#events div.event p {
        margin-bottom: 22px;
    }

    div#events div.event p.last {
        margin-bottom: 22px;
    }

    div#events div.event img {
        width: 100%
    }

    /* 17. About */
    div#about {
        width: 62%;
    }

    div#about img {
        width: 100%;
    }

}

/* For iPhones and Mobile */
@media only screen and (max-width: 750px) {
    /*  PHONES AND MOBILE DEVICES -----------------------------------------------     */
    /* 1. Global */
    header {
        height: 62px;
        border-bottom: 3px solid #d07837;
    }

    .container {
        max-width: 360px;
        width: 320px;
        min-width: 300px;
        overflow: hidden;
        margin: 0 auto;
    }

    section.page_heading {
        height: 126px;
    }

    section.page_heading .logo a {
        display: none;
    }

    section.page_heading .logo .tagline {
        font-size: 15px;
        line-height: 22px;
        font-family: 'Georgia';
        font-style: italic;
        position: absolute;
        top: 73px;
        left: 22px;
        white-space: nowrap;
    }

    .logo img#ihc-logo {
        position: absolute;
        top: 10px;
        left: 22px;
        max-width: 220px;
        width: 110%;
        border: 0px solid yellow;
    }

    div.flexslider-container img#ihclogo {
        position: absolute;
        top: -136px;
        left: -12px;
        max-width: 210px;
        width: 100%;
    }

    div.page_wrapper,
    div.page_wrapper2 {
        padding-top: 30px;
    }

    /*div.page_wrapper aside {
        width: 100%;
        float: none;
    }*/
    /* 2. Header and Navigation */
    header nav ul {
        display: none !important;
    }

    header .select-menu {
        display: block;
        float: left;
        margin-left: 1.6em;
    }

    /*header aside {
        float: right;
        padding-top: 0px;
        width: auto;
        margin-top: 22px;
    }*/
    header nav select {
        -webkit-padding-end: 22px;
        margin-top: -5px;
    }

    header nav {
        margin-top: 25px;
    }

    header nav ul {
        padding-top: 14px;
    }

    header nav ul li {
        margin-right: -14px;
    }

    header nav ul li a {
        font-size: 13px;
        padding: 5px 9px;
    }

    header nav ul li a:hover {
        background: none;
        text-decoration: underline;
    }

    header nav ul li.current-menu-item a {
        background: none;

    }

    /* 3. Homepage */
    section.page_heading .logo .tagline {
        margin-top: -9px;
    }

    div#home .page {
        margin-top: 125px;
    }

    div#home div.sub_heading {
        margin-bottom: 15px;
    }

    div#description {
        float: none;
        padding-right: 0;
        text-align: center;
        width: 100%;
        margin-bottom: 16px;
        margin-right: 0px;
    }

    div#description h3 {
        font-size: 20px;
    }

    div#actions {
        float: none;
        width: 100%;
    }

    div#actions span.icon {
        margin-left: 2px;
    }

    div#actions .one_half {
        width: 100%;
    }

    div#help {
        padding-bottom: 65px;
    }

    div#help .text {
        margin-left: 55px;
    }

    div#help .text h3 {
        font-size: 20px;
    }

    div#help .donate_button {
        top: 130px;
        right: 100px;
        padding: 8px 16px;
    }

    div.news, div.events, div#sponsors {
        width: 100%;
    }

    div#sponsors ul li {
        width: 43.3%;
    }

    .flex-caption {
        display: none;
    }

    /*  request info*/
    div.two_thirds3 {
        width: 99%;
        margin: .5% auto;
        padding: .5em 0;
    }

    div.three_fourths {
        width: 82%;
        padding: .3em .6em;
        margin: 1em auto;
        background: #f0eee0;
        border: 0px solid #DFDBC4;
    }

    div.three_fourths table.one,
    div.three_fourths table.two {
        width: 45%;
        padding-right: 1em;
        margin: 5px auto;
        float: none;
        border: 0;
    }

    div.three_fourths table.one td p,
    div.three_fourths table.two td p {
        width: 98%;
        margin: 5px 0;
        font-size: 102%;
    }

    div.three_fourths table.one td img,
    div.three_fourths table.two td img {
        width: 75%;
        height: auto;
        margin: 5px auto;
    }

    div.three_fourths table.one td p.book1,
    div.three_fourths table.one td p.book2 {
        margin-left: 5px;
    }

    div.three_fourths table.one td p.book3,
    div.three_fourths table.one td p.book4 {
        margin-left: 5px;
    }

    div.three_fourths table.one td p.book3,
    div.three_fourths table.one td p.book4 {
        width: 45%;
    }

    div.three_fourths table.one td p.book3 {
        margin: 0 4px;
    }

    div.three_fourths table.one td p.book4 {
        margin: 3px;
    }

    /* 5. Gallery */
    ul.filter_list li {
        margin-right: 0;
    }

    div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails img,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails img {
        width: 100%;
        height: auto;
        float: none;

    }

    /*div.page_wrapper section.container div#gallery.page.with_sidebar ul.gallery_thumbnails img  {
        width: 100%;
        height: 100%;
    }*/
    div.page_wrapper section.container div#gallery.page, div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.two_column, div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.three_column, div.page_wrapper section.container div#gallery.page ul.gallery_thumbnails.four_column {
        width: 277px;
    }

    div.page_wrapper2 section.container div#gallery.page,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.two_column,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.three_column,
    div.page_wrapper2 section.container div#gallery.page ul.gallery_thumbnails.four_column {
        width: 295px;
    }

    div.page_wrapper section.container div#gallery ul.gallery_thumbnails li,
    div.page_wrapper2 section.container div#gallery ul.gallery_thumbnails li {
        width: 295px;
        height: auto;
        margin-bottom: 11px;
        margin-right: 0px;
    }

    .showcase,
    h2#call {
        width: 96%;
    }

    /*  Recent Projects - Open House Archive*/
    div.tours div.tour_details,
    div.tours div.tour_detailz {
        max-width: 280px;
        width: 90% !important;
        border: 0px solid red;
    }

    div.tours div.tour_details h4 {
        width: 69%;
        letter-spacing: 0px;
        border: 0px solid green; /*display: inline-block; white-space: nowrap;*/
    }

    div.tours div.tour_pix {
        max-width: 250px;
        float: none;
        width: 95%;
    }

    div.tours div.tour_pix2 {
        max-width: 278px;
        float: none;
        width: 95%;
    }

    div.tours div.tour_pix a img,
    div.tours div.tour_pix2 img {
        max-width: 248px;
        width: 95%;
    }

    div#events_tours div.tours div.tour_details2 {
        width: 95%;
        float: none !Important;
    }

    /*what's new recent projects*/
    div.join p.showbox {
        width: 98%;
        float: none;
        clear: both;
    }

    div.join ul.addr {
        width: 95%;
        float: none;
        margin-left: -0.4em;
    }

    article.prods {
        max-width: 279px;
        width: 95%;
        float: none;
        overflow: hidden;
        clear: both;
        border: 0px solid green;
        padding-left: 0;
    }

    article.prods div#sales1 {
        max-width: 260px;
        width: 95%;
        float: none;
        clear: both;
    }

    article.prods div#sales2 {
        max-width: 289px;
        width: 95%;
        float: none;
    }

    article.prods div#sales1 p {
        max-width: 225px;
        width: 98%;
        font-size: 85%;
        line-height: 1.2em;
        clear: both;
        border: none;
        overflow: hidden;
    }

    article.prods div#sales2 p {
        width: 98%;
        border: 0px;
        float: left;
        clear: both;
        overflow: hidden;
    }

    article.prods div#sales2 p a img {
        float: none;
        max-width: 250px;
        width: 140%;
        margin-left: -1.9em;
        display: block;
    }

    article.prods blockquote.blockquote2 {
        max-width: 285px;
        width: 92%;
        margin-left: -2.3em;
        overflow: hidden;
    }

    article.prods blockquote.blockquote2 p a {
        font-size: 81%;
        line-height: 1.0em;
        font-style: normal;
        font-weight: normal;
    }

    div#events p.back {
        max-width: 300px;
        width: 98%;
        border: 0px solid red;
    }

    .intro,
    .containerbox {
        max-width: 300px;
        width: 98%;
    }

    .containerbox div.zoom {
        width: 98%;
    }

    .intro p {
        font-size: 13px;
    }

    .galleryItem-p2 {
        max-width: 295px;
        width: 98%;
        float: none !Important;
        border: 0px solid red;
    }

    .galleryItem-p2 img {
        max-width: 295px;
        width: 98% !Important;
        height: auto;
        float: none !Important;
        border: 0px solid blue;
    }

    .galleryItem-p2 h4 {
        font-size: 14px;
    }

    .galleryItem-p2 p {
        font-size: 13px;
    }

    /* 7. Donate */
    div#donate {
        width: 93%;
    }

    div#donate h1 {
        margin-bottom: 8px;
    }

    div#donate div#donation_level {
        margin-top: 20px;
        overflow: hidden;
    }

    div#donate div#donation_level div.box_heading {
        margin-bottom: 14px;
    }

    div#donate div#donation_level p.choose {
        width: 100%;
    }

    div#donate div#donation_level ul.amount {
        margin-top: 12px;
        margin-bottom: 25px;
    }

    div#donate div#donation_level ul.amount li a {
        margin-right: 7px;
    }

    /* 8. Contact */
    div#contact {
        width: 93%;
    }

    div#contact div.full {
        margin-bottom: 14px;
    }

    div#contact h1 {
        margin-bottom: 15px;
    }

    div#contact div.row {
        width: 277px;
    }

    div#contact div.row p {
        width: 89%;
        margin-right: 0;
    }

    div#contact p {
        margin-bottom: 18px;
    }

    div#contact form {
        overflow: hidden;
    }

    div#contact textarea {
        width: 90%;
        margin-top: 12px;
        padding-top: 10px;
    }

    div#contact textarea label {
        padding-top: 10px;
    }

    div#contact div.row input {
        width: 102%;
    }

    div#contact div.row select {
        width: 100%;
    }

    div#contact div#location div.box_heading {
        margin-bottom: 12px;
    }

    div#contact div#location div.one_fourth {
        width: 100%;
        margin-top: 12px;
    }

    div#contact div#location h4 {
        margin-bottom: 6px;
    }

    div#contact div#location div.map {
        width: 100%;
        margin-right: 0;
    }

    div#contact div#location div.map iframe {
        width: 96%;
    }

    /* 9. Footer */
    footer {
        padding-top: 2em;
    }

    footer div.one_fourth,
    footer div.copy {
        max-width: 320px;
        width: 92%;
        margin-left: 1.5%;
        font-size: 115%;
        line-height: 140%;
    }

    footer div.one_fourth h3.logo {
        font-size: 140%;
        font-weight: 400;
    }

    footer div.one_fourth h5 {
        font-size: 125%;
        color: #598080;
    }

    footer div.one_fourth p.org {
        font-size: 102%;
        line-height: 150%;
        width: 91%;
    }

    footer div.copy {
        width: 70%;
        margin: 0;
        font-size: 105%;
    }

    /* 15. Events List */
    div#events_list h1 {
        margin-bottom: 18px;
    }

    div#events_list div.list div.event_details {
        width: 100%;
        margin-bottom: 20px;
    }

    div#events_list div.list div.event_date {
        overflow: hidden;
        float: none;
        width: 91%;
    }

    div#events_list div.list div.box_heading {
        margin-bottom: 20px;
    }

    /* 16. Event Description */
    div#events h1 {
        font-size: 25px;
        margin-bottom: 18px;
    }

    div#events a {
        margin-top: -47px;
    }

    div#events div.event ul.two {
        margin-right: 0px;
    }

    div#events div.event p {
        margin-bottom: 24px;
    }

    div#events div.event img {
        width: 100%;
    }

    div#events div.event p.last {
        margin-bottom: 28px;
    }

    div#events div.event div.event_date ul.one li, ul.three li {
        font-weight: normal;
    }

    /* 17. About */
    div#about {
        width: 93%;
    }

    div#about div.full p.larger {
        text-align: center;
        font-size: 14px;
    }

    div#about h1 {
        margin-bottom: 14px;
    }

    div#about img {
        width: 100%;
    }

    div#programs {
        width: 295px;
    }

    div#programs div.box_heading {
        margin-bottom: 22px;
    }

    div#programs div.one_third {
        width: 100%;
    }

    div.join img {
        max-width: 290px;
        width: 104%;
    }

    div.join2 img {
        max-width: 270px;
        width: 99%;
        margin: .5em auto;
    }

    div.join article.opp,
    div.join article.prods2,
    div.join article.offer,
    div.join article.need {
        max-width: 245px;
        width: 92%;
        margin-right: 0;
    }

    div.join article.success5 {
        max-width: 230px;
        width: 84%;
    }
}