/*
 * This is a good website to get your percentages http://pixelperc.com
 * For this example, I used http://pixelperc.com/730/30/200
 */

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

    /* ==========================================================================
       0 - 480 Styles
       ========================================================================== */
    
    /* Layout and Grid styles ===================== */
    body div#pageWrap {
        max-width: 100%;
    }
    div#page {
        width: 100%; /*  */
    }
    div#copy {
        width: 100%;
        padding: 0.5% 0 0 0;
    }
    div#content div#content {
        width: 100%; /* 692px out of 750px */
    }
    body.single-post div.post,
    body.blog div.post,
    body.category div.post,
    body.tag div.post,
    body.author div.post,
    body.date div.post {
        padding: 70px 21px 15px 21px;
    } 
    
    /* sub navigatin */ 
    div#content ul.menu li {
       /* width: 100%;
        margin-right: 0;*/
    }
    
    body.process div#copy {
        width: 96%;
        padding: 0;
    }
    
    /* Single Work Template */
    body.single-work div#content div#copy {
        width: 96%;
        margin: auto;
        float: none;
    }
    div#related-work {
        width: 96%;
        margin: 0;
    }
    div#related-work li {
        width: 48%;
        margin: 0 0.5% 2% 0.5%;
        float: left;
    }
    div#related-work li a {
        min-height: 240px;
    }
    body.single-work div#content div#copy div.hentry {
        margin: 0;
    }
    ol.commentlist li div {
        width: 100%;
    }
    
    /* team page */
    body.team div#content ul.menu {
        margin: 0;
    }
    body.team div#content h1 {
        width: 100%;
        padding: 32px 30px 30px 30px;
    }
    
    /* Blog Template */
    body.blog div#content div#copy,
    body.single-post div#content div#copy {
        width: 95%;
        margin: auto;
    }
    
    /* footer */
    div#footer {
        background: #FFF;
    }
    div#footer ul#vcard {
        padding: 15px 25px 0 25px;
        width: auto;
    }
    div#footer p#copyright {
        padding: 3%;
    }
    
    body.contact div.info {
        float: none;
        width: 100%;
        height: auto;
        background: #1B1818;
        padding: 25px 10px;
        text-align: center;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    
    /* Element Specific Styles ===================== */
    
    /* home page */
    div#intro h1 {
        padding: 5% 5%;
        width: 100%;
    }
    div#header {
        background: #1B1818;
    }
    div#logo {
        margin: 0 0 0 40px;
    }
    div.tools {
        float: none;
        padding-top: 20px;
        clear: both;
    }
    div.tools div.links {
        padding: 0 5%;
        overflow: hidden;
    }
    div.tools div.social {
        clear: none;
        float: right;
        padding-top: 2px;
    }
    form#site_search {
        width: 64%;
        float: left;
    }
    form#site_search input {
        width: 100%;
        height: 30px;
    }
    form#site_search button {
        top: 4px;
    } 
    
    
    
    
    /* nav about wrapper */
    div#nav-about-wrapper {
        float: none;
        width: 100%;
    }
    ul#nav-about {
        width: 100%;
        margin: auto;
        float: none;
        height: auto;
    }
    ul#nav-about li {
        /*width: 100%;*/
    }
    
    
    /* LIST STYLES */
    div.listed {
        padding: 7px 0;
        width: 100%;
    }
    div.listed a div.featured-image {
        display: block;
        width: 100%;
        float: none;
        position: relative;
        background: #eee;
        text-align: center;
    }
    div.listed.alt a div.featured-image {
        float: none;
    }
    div.listed div.entry {
        width: 100%;
        padding: 2.5% 2.5% 0.5% 2%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: none;
    }
    div.listed.alt div.entry {
        float: none;
    }    
    
    
    /* Single blog post */
    form#commentform label {
        float: none;
        padding: 0;
        width: 100%;
    }
    form#commentform input.text,
    form#commentform textarea {
        width: 100%;
    }
    
    /* Single Team Member */
    body.single-team div#content div#copy {
        width: 97%;
        margin: auto;
    }
    body.single-team div.entry {
        width: 100%; 
    }
    body.single-team div.info div.description {
        width: 40%;
        float: left;
    }
    body.single-team div.info ul {
        width: 50%;
        float: left;
    }
    body.single-team div.info h6 {
        width: 35%;
        bottom: 0;
    }
    body.single-team div.persisted {
        position: static;
        width: 100%;
        height: auto;
    }
    
    /* About > Process */
    ol#process li {
        width: 100%;
        text-align: center;
    }
    ol#process li h2,
    ol#process li.alt h2 {
        float: none;
        width: 234px;
        margin: auto;
    }
    ol#process li.alt p {
        text-align: center;
        padding: 50px 5% 0;
        background: transparent url('/wp-content/themes/rd2inc/images/bg-process-bracket-bottom.png') center 15px no-repeat;
    }
    ol#process li p {
        width: 100%;
        float: none;
        margin: 0 auto 30px auto;
        padding: 50px 5% 0;
        background: transparent url('/wp-content/themes/rd2inc/images/bg-process-bracket-bottom.png') center 15px no-repeat;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        min-height: 105px;
        text-align: center;
        font-size: 1.0em;
    }
    ol#process li h2 {
        padding: 85px 0 0 0;
    }
    ol#process li h2.two-words {
        padding: 73px 40px 0 40px;
    }
    ol#process li h2.three-words {
        padding: 65px 40px 0 40px;
    }
    
    
    /* Contact us */
    body.contact div.info h1 {
        font-size: 1.75em; /* 28 / 16 */
    }
    div.gform_wrapper.contact-us_wrapper div.gform_body {
        width: 90%;
    }
    div.gform_wrapper.contact-us_wrapper div.gform_body input,
    div.gform_wrapper.contact-us_wrapper div.gform_body textarea,
    div.gform_wrapper.contact-us_wrapper div.gform_body select {
        width: 100%;
    }
    
    div#footer p#copyright {
        width: 100%;
        color: #777;
        background: #e4e4e4;
        font-size: 11px;
        position: static;
        bottom: auto;
        right: auto;
        margin: 0;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;        
    }
    
    /* Hide/Show Styles ===================== */
    
    div.sharer,
    div#postcards,
    div.listed a div.featured-image img:first-child,
    body.blog div#content ul.menu,
    body.archive div#content ul.menu,
    body.work div#content ul.menu,
    body.single-work div#content ul.menu,
    body.specialties div#content ul.menu,
    body.clients div#content ul.menu,
    body.team div#content h1 {
        display: none;
    }
    div#content select.dropdown-menu {
        display: block;
    }
    
}

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

    /* ==========================================================================
       480 Styles
       ========================================================================== */
    
    /* Layout and Grid styles ===================== */
     
     body div#pageWrap {
         max-width: 600px;
     }  
     body.single-post div.post,
     body.blog div.post,
     body.category div.post,
     body.tag div.post,
     body.author div.post,
     body.date div.post {
         padding: 31px 60px 15px 60px;
     }  
     
     /* about > team */
     body.team div#content div#copy {
         width: 73.5%; /* 441px out of 600px */
     }
     body.team div#content h1 {
         width: 100%;
         padding: 32px 30px 30px 30px;
     }
     body.page-template-page-team-php div#content div#annex1 {
         display: none !important;
     }
     body.page-template-page-team-php div#content div#copy {
         margin: auto;
     }
     
     
     
     /* Element Specific Styles ===================== */
     
     div#intro h1 {
         padding: 5% 10%;
         width: 100%;
     }
     div#logo {
         margin: 0 0 0 30px;
     }
     div.tools div.links {
         padding: 10px 17px 0 0;
     }
     
     div#content ul.menu {
        /* margin: 0;*/
     }
     
     div.tools {
         float: right;
         padding-top: 0;
         clear: none;
     }
     div.tools div.links {
         overflow: hidden;
         background: #1B1818;
         padding: 23px 0 0 0;
     }
     div.tools div.social {
         overflow: hidden;
         float: right;
         clear: both;
     }
     
     form#site_search {
         width: 157px;
         float: right;
     }
     form#site_search input {
         width: 156px;
         height: 22px;         
     }
     form#site_search button {
         top: 0;
     }
     
     /* LIST STYLES */
     div.listed a div.featured-image {
         display: block;
         width: 63.85737%;
         float: right;
         position: relative;
     }
     div.listed.alt a div.featured-image {
         float: left;
     }
     div.listed div.entry {
         width: 36.14263%;
         padding: 2.5% 2.5% 0.5% 2%;
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         box-sizing: border-box;
         float: left;
     }
     div.listed.alt div.entry {
         float: right;
     }
     
     body.single-work div#content {
         -webkit-text-size-adjust: none;
     }
     
     
     div#nav-about-wrapper {
         float: none;
         width: 100%;
     }
     ul#nav-about {
         width: 83.5%;
         margin: auto;
         float: none;
     }
     ul#nav-about li {
         width: 33.3339%;
     }
     
     /* Contact page */
     body.contact div.info h1 {
         font-size: 1.45em; /* 28 / 16 */
     }
     body.home div#header,
     body.contact div#header {
         z-index: 10000;
         width: 100%;
         position: relative;
         left: auto;
         top: auto;
     }
     
     body.page-template-page-contact-php div.entry { width: 100%; }
     div.gform_wrapper.contact-us_wrapper div.gform_footer input[type="submit"] {
         position: relative;
         left: auto;
         top: auto;
     }
     
     /* Single Team Member Page */
     
     
     /* Single blog post */
     form#commentform label {
         float: none;
         padding: 0;
         width: 42.85714%; /* 300px out of 700px */
     }     
     form#commentform input.text,
     form#commentform textarea {
         width: 100%;
     }
     
     ol#process li p {
         width: 70%;
     }
     
     /* footer */
     div#footer {
         background: #1B1818;
     }
     
     /* Hide/Show Styles ===================== */
     
     

}

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

    /* ==========================================================================
       600 Styles
       ========================================================================== */
    
    /* Layout and Grid styles ===================== */
     
     body div#pageWrap {
         max-width: 600px;
     }
     
     /* Single Work Template */
     div#related-work li {
         width: 30%;
         margin: 0 0.5% 2% 0.5%;
         float: left;
     }
     body.single-work div#content div#copy div.hentry {
         margin: 0;
     }
     ol.commentlist li div {
         width: 100%;
     }
     
    /* sub navigatin */ 
    div#content ul.menu li {
        width: 32.7818%;
        margin-right: 0.8273%;
    }
     
     /* about > team */
     body.team div#content div#copy {
         width: 73.5%; /* 441px out of 600px */
     }
     body.team div#content h1 {
         width: 100%;
         padding: 32px 30px 30px 30px;
     }
     body.page-template-page-team-php div#content div#annex1 {
         display: none !important;
     }
     body.page-template-page-team-php div#content div#copy {
         margin: auto;
     }
     
     /* Single Team Member */
     body.single-team div#content div#copy {
         width: 97%;
         margin: 0 0 0 3%;
     }
     body.single-team div.entry {
         width: 75.41667%; /* 543px out of 720px */
     }
     body.single-team div.persisted {
         width: 24.58333%; /* 177px out of 720px */
         position: absolute;
         height: 188px;
         top: 0;
         right: 0;
     }
     body.single-team div.info div.description {
         width: 100%;
         float: none;
     }
     body.single-team div.info ul {
         width: 100%;
         float: none;
     }
     body.single-team div.info h6 {
         width: 30%;
         bottom: -33px;
     }
     
     /* Element Specific Styles ===================== */
     
     div#header {
         background: #1B1818;
     }
     div#logo {
         margin: 0 0 0 50px;
     }
     div.tools div.links {
         padding: 10px 17px 0 0;
     }
     div.tools div.social {
         clear: none;
     }
     
     div#content ul.menu {
        /* margin: 0;*/
     }
     
     /* home page */
     div#postcards #next,
     div#postcards #prev {
         top: 0;
     }
     div#intro h1 {
         padding: 5% 18%;
         width: 100%;
     }
     div#nav-about-wrapper {
         float: none;
         width: 100%;
     }
     ul#nav-about {
         width: 83.5%;
         margin: auto;
         float: none;
     }
     
     div.listed {
         padding: 4px 0;
     }
     
     /* Contact page */
     body.home div#header,
     body.contact div#header {
         z-index: 10000;
         width: 100%;
         position: relative;
         left: auto;
         top: auto;
     }
     body.contact div.info {
         float: none;
         width: 100%;
         height: auto;
         background: #1B1818;
         padding: 25px 0;
         text-align: center;
         position: relative;
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         box-sizing: border-box;
     }
     body.page-template-page-contact-php div.entry { width: 100%; }
     div.gform_wrapper.contact-us_wrapper div.gform_footer input[type="submit"] {
         position: relative;
         left: auto;
         top: auto;
     }
     
     /* Single Team Member Page */
     body.single-team div.info h6 {
         width: 100%;
     }
     
     body.single-work div#content {
         -webkit-text-size-adjust: auto;
     }
     
     /* About > Process Page */
     ol#process li {
         width: 100%;
         float: none;
     }
     ol#process li.alt {
         float: none;
     }
     ol#process li.alt h2 {
         float: left; 
         width: 37.92545%; /* 234px out of 617px */         
     }
     ol#process li h2 {
         float: left;
        width: 37.92545%; /* 234px out of 617px */ 
     }
     ol#process li.alt p {
         text-align: left;
         padding: 0 0 0 70px;
         background: transparent url('/wp-content/themes/rd2inc/images/bg-process-bracket-right.jpg') 20px center no-repeat;
     }
     ol#process li p {
         width: 62.07455%; /* 383px out of 617px */
         float: right;
         margin: 40px 0 0 0;
         padding: 0 0 0 70px;
         background: transparent url('/wp-content/themes/rd2inc/images/bg-process-bracket-right.jpg') 20px center no-repeat;
         -webkit-box-sizing: border-box;
         -moz-box-sizing: border-box;
         box-sizing: border-box;
         min-height: 105px;
         text-align: left;
         font-size: 0.9em;
     }
     ol#process li h2 {
         padding: 14% 0 0 0;
     }
     ol#process li h2.two-words {
         padding: 12% 40px 0 40px;
     }
     ol#process li h2.three-words {
         padding: 10.5% 40px 0 40px;
     }
     
     /* contact page */
     body.contact div.info h1 {
         font-size: 1.75em; /* 28 / 16 */
     }   
     
     div#footer p#copyright {
         width: 220px;
         color: #777777;
         background: #1B1818;
         font-size: 11px;
         position: absolute;
         bottom: 0;
         right: 0;
         margin: 0;
         -webkit-box-sizing: content-box;
         -moz-box-sizing: content-box;
         box-sizing: content-box;        
     } 
     /* Hide/Show Styles ===================== */
     
     div.sharer,
     div#postcards,
     div.listed a div.featured-image img:first-child,
     body.blog div#content ul.menu,
     body.archive div#content ul.menu,
     body.work div#content ul.menu,
     body.single-work div#content ul.menu,
     body.specialties div#content ul.menu,
     body.clients div#content ul.menu,
     body.team div#content h1 {
         display: block;
     }
     
     div#content select.dropdown-menu {
         display: none;
     }
    
    
}
/*@media only screen 
and (min-device-width : 768px) 
and (max-device-width : 1024px)*/
@media only screen and (min-width: 750px) {

    /* ==========================================================================
       750 Styles
       ========================================================================== */
    
    /* Layout and Grid styles ===================== */
    
    body div#pageWrap {
        max-width: 768px;
    }
    div#copy {
        padding: 0;
    }
    body.process div#copy {
        width: auto;
        padding: 0;
    }
    div#header ul {
        padding-right: 0;
    }
    
    /* Single Work Template */
    body.single-work div#content div#copy {
        width: 66.93333%; /* 502px out of 750 */
        margin: 0 0 0 4%;
        float: left;
    }
    div#related-work {
        width: 21.73333%; /* 163px out of 750 */
        margin: 19px 4% 0 0;
    }
    div#related-work li a {
        min-height: 0;
    }
    body.single-work div#content div#copy div.hentry {
        margin: 0;
    }
    div#related-work li {
        width: 100%;
        margin: 0 0 10px 0;
        float: none;        
    }
   
    
    /* about > team */
    
    body.team div#content div#copy {
        width: 81.40496%; /* 788px out of 968px */
    }
    body.page-template-page-team-php div#content h1 {
        width: 100%;
        padding: 32px 115px 30px 115px;
    }
    body.page-template-page-team-php div#content div#annex1 {
        display: none !important;
    }
    body.page-template-page-team-php div#content div#copy {
        margin: auto;
    }
    
    /* Single Team Member */
    body.single-team div#content div#copy {
        width: 97%;
        margin: 0 0 0 3%;
    }
    body.single-team div.entry {
        width: 75.41667%; /* 543px out of 720px */
    }
    
    /* Element Specific Styles ===================== */
    
    div#logo {
        margin: 0 0 0 50px;
    }
    div.tools div.links {
        padding: 10px 17px 0 0;
    }
    
    div.listed {
        width: 78.29949%; /* 617px out of 788px */
        padding: 0;
    }
    
    /* home page */
    div#postcards #next,
    div#postcards #prev {
        top: 0;
    }
    div#nav-about-wrapper {
        float: none;
        width: 100%;
    }
    ul#nav-about {
        width: 64.53333%;
        margin: auto;
        float: none;
    }
    
    /* Contact page */
    body.home div#header,
    body.contact div#header {
        z-index: 10000;
        width: 100%;
        position: relative;
        left: auto;
        top: auto;
    }
    body.contact div.info {
        float: none;
        width: 100%;
        height: auto;
        background: #1B1818;
        padding: 25px 0;
        text-align: center;
        position: relative;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    body.page-template-page-contact-php div.entry { width: 100%; }
    div.gform_wrapper.contact-us_wrapper div.gform_footer input[type="submit"] {
        position: relative;
        left: auto;
        top: auto;
    }
    div.gform_wrapper.contact-us_wrapper div.gform_body li.message {
        position: absolute;
        left: 337px;
        top: 0;
        width: 280px;
    }
    div.gform_wrapper.contact-us_wrapper div.gform_body {
        width: 554px;
    }
    div.gform_wrapper.contact-us_wrapper div.gform_body input,
    div.gform_wrapper.contact-us_wrapper div.gform_body textarea,
    div.gform_wrapper.contact-us_wrapper div.gform_body select {
        width: 265px;
    }
    
    /* Single Team Member Page */
    body.single-team div.info h6 {
        width: 100%;
    }
    
    /* Single blog post */
    form#commentform label {
        float: right;
        padding: 0 0 0 15px;
    }
    form#commentform input.text,
    form#commentform textarea {
        width: 57.14286%; /* 400px out of 700px */
    }
    
    /* about process page */
    ol#process li {
        width: 78.29949%; /* 617px out of 788px */
        float: right;
    }
    ol#process li.alt {
        float: left;
    }
    ol#process li.alt h2 {
        float: right;
    }
    ol#process li.alt p {
        text-align: right;
        padding: 0 70px 0 0;
        background: transparent url('/wp-content/themes/rd2inc/images/bg-process-bracket-left.jpg') 94% center no-repeat;
    }
    
    div#footer {
        background: #1B1818;
    }
    div#footer ul#vcard {
        padding: 15px 25px 0 25px;
        width: auto;
    }
    div#footer p#copyright {
        padding: 0 15px 25px 20px;
    }
    
    /* Hide/Show Styles ===================== */
    
}

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

    /* ==========================================================================
       960 Styles
       ========================================================================== */
    
    /* Layout and Grid styles ===================== */
    
    body div#pageWrap {
        max-width: 1150px;
    }
    div#page {
        width: 85.21739%; /* 980px out of 1150 */
    }
    div#content {
        width: 98.77551%; /* 968px out of 980px */
    }
    div#content div#copy {
        width: 81.40496%; /* 788px out of 968px */
    }
    div#header ul {
        padding-right: 35px;
    }
    
    /* Blog Template */
    body.blog div#content div#copy,
    body.single-post div#content div#copy {
        width: 81.40496%; /* 788px out of 968px */
        margin: 0;
    }
    ol.commentlist li div {
        width: 90%;
    }
    
    /* Single Work Template */
    
    
    /* Single Work Template */
    body.single-work div#content div#copy {
        width: 73.34711%; /* 710px out of 960 */
        margin: 0;
    }
    div#related-work {
        width: 22.93388%;
        margin: 19px 0 0 0;
    }
    body.single-work div#content div#copy div.hentry {
        margin: 0 0 0 4%;
    }
    body.page-template-page-team-php div#content div#copy {
        
    }
    
    /* about > team */
    body.team div#content ul.menu {
        margin: 0 0 1.2em 0;
    }
    body.page-template-page-team-php div#content h1 {
        width: 100%;
        padding: 23px 60% 23px 35px;
        background: #1B1818 url(/wp-content/themes/rd2inc/images/bg-contact-h1.jpg) right top no-repeat;
    }
    body.page-template-page-team-php div#content div#annex1 {
        display: block !important;
    }
    
    /* Single Team Member */
    body.single-team div#content div#copy {
        width: 100%;
        margin: 0;
    }
    body.single-team div.entry {
        width: 72.72727%; /* 704px out of 968px */
    }
    
    /* Element Specific Styles ===================== */
    
    div#header {
        background: none;
    }
    div#logo {
        margin: 0 0 0 93px;
    }
    div.tools div.links {
        padding: 10px 85px 0 0;
    }
    
    div#content ul.menu {
        margin: 0 0 25px 0;
    }
    div.listed {
        width: 78.29949%; /* 617px out of 788px */
        padding: 0;
    }
    
    /* home page */
    div#postcards #next,
    div#postcards #prev {
        top: 29%;
    }
    div#intro h1 {
        padding: 30px 10px 0 30px;
        width: 50%;
        float: left;
    }
    div#nav-about-wrapper {
        float: left;
        width: 50%;
    }
    ul#nav-about {
        width: 100%;
        float: left;
    }
    
    /* Contact page */
    body.home div#header,
    body.contact div#header {
        z-index: 10000;
        width: 100%;
        position: absolute;
        left: 0;
        top: 0;
    }
    body.contact div.info {
        float: right;
        width: 33.8843%; /* 328px out of 968px */
        background: #1B1818;
        text-align: left;
        padding: 40px  0px 50px 20px;
        position: relative;
    }
    body.page-template-page-contact-php div.entry { width: 66.1157%; /* 640px out of 968px */ }
    div.gform_wrapper.contact-us_wrapper div.gform_footer input[type="submit"] {
        position: absolute;
        right: 0;
        top: 194px;
    }
    
    /* Single Team Member Page */
    body.single-team div.info h6 {
        width: 176px;
    }
    body.single-team div.persisted {
        width: 27.27273%; /* 264px out of 968px */
    }
    body.single-team div.persisted.floating {
        position: fixed;
        right: auto !important;
        margin-left: 704px;
    }
    
    /* about process page */
    ol#process li {
        width: 78.29949%; /* 617px out of 788px */
        float: right;
    }
    ol#process li.alt {
        float: left;
    }
    
    div#footer {
        background: none;
    }
    div#footer ul#vcard {
        padding: 15px 0 0 80px;
        width: 294px;
    }
    div#footer p#copyright {
        padding: 15px 110px 25px 20px;
    }
    
    /* Hide/Show Styles ===================== */
    
    
}

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

    /* ==========================================================================
       1382 Styles
       ========================================================================== */
       
    /*body {
    max-width: 1440px;
    }*/
}
@media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min--moz-device-pixel-ratio: 1.5), only screen and (min-device-pixel-ratio: 1.5) {
    /* 2x styles =================================================== */
}