@charset"UTF-8";

/* CSS Document */

/* larger screens */
 @media (min-width: 1220px) {
}

/* general purpose */
 @media (min-width: 960px) and (max-width: 1219px) {
    .content_wrapper {
        margin-top:65px;
    }
    #header {
        height: 65px;
    }
    #menu {
        right: 30px;
    }
    #menu li {
        margin-left: 25px;
    }
    #menu a {
        font-size: 15px;
    }
    #search {
        height: 65px;
    }
    #search_area {
        top: 65px;
    }
    #offset {
        margin: 0 auto;
    }
    .about #content_left {
        width: 740px !important;
    }
    h2.about {
        font-size: 28px !important;
        padding: 0 30px 50px 20px !important;
    }
    #socialBox {
        margin-left: 45px !important;
    }
    #wrapper.contact {
        width: 100% !important;
    }
    #map {
        height:308px !important;
    }
    #mission {
        width: 100% !important;
    }
    #mission #mission_text {
        font-size: 20pt !important;
    }
    #wrapper.contact {
        width: 960px !important;
        padding: 0 20px;
    }
    #info {
        width: 225px;
    }
    .about #window {
        width: 745px !important;
    }
    .about #slider, .about #left, .about #right {
        height: 312px !important;
    }
    .about #slider li, .about #slider li img {
        width: 745px !important;
        height: 312px !important;
    }
    #blog_header {
        width: 960px;
    }
    #entry {
        width: 960px;
    }
    #entry #body {
        width: 685px;
    }
    #entry #image img {
        width: 960px;
    }
    #comment_holder #comment_and_share {
        width: 960px;
    }
    #entry #thumbnail img {
        width:520px;
    }
    .header_about {
        height:308px;
    }
}


/* mini tablet */
 @media only screen and (min-width: 681px) and (max-width: 959px) {
    .content_wrapper {
        margin-top:55px;
    }
    #header {
        height: 65px;
    }
    #offset {
        margin: 0 auto;
    }
    #menu, #search, #filters {
        display:none;
    }
    #menu {
        background: #ea0079;
        padding:0;
        right: 15px;
        top: 65px;
        color: #1f1f1f;
        width:100%;
    }
    #menu li {
        float:none;
        text-align:center;
        width:100%;
        margin:0 auto;
    }
    #menu a:link, #menu a:active, #menu a:visited, #menu a:hover, #menu .menu_selected a:link, #menu .menu_selected a:active, #menu .menu_selected a:visited, #menu .menu_selected a:hover {
        color: #fff;
        margin:15px auto;
        display:block;
        font-weight: bold;
    }
    #menu_icon {
        display:block;
    }
    .about #content_left {
        width: 560px !important;
    }
    h2.about {
        font-size: 26px !important;
        padding: 0 20px 40px 15px !important;
    }
    #wrapper.contact {
        width: 100% !important;
    }
    #info {
        padding: 0 1% 0 4% !important;
        float: left;
        width: 39%;
    }
    #contactForm, #info {
        /*float:none !important;*/
        /*width: 48%;*/
        margin:25px auto !important;
    }
    #contactForm {
        width: 53%;
        float: left;
    }
    #name, #email, #company {
        width: 100%;
        height: 36px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #message {
        width: 100%;
        height: 143px;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
    }
    #message .message_bus {
        height: 102px;
    }
    #socialBox {
        width: 90%;
        text-align: center;
        margin:0 auto;
        float:none;
    }
    .side {
        display: inline-block;
    }
    #map {
        height:264px !important;
    }
    #mission {
        width: 90% !important;
        margin: 33px auto !important;
    }
    #mission #mission_text {
        font-size: 18pt !important;
    }
    .contact .page {
        width: 100% !important;
    }
    .about #window {
        width: 570px !important;
    }
    .about #slider, .about #left, .about #right {
        height: 239px !important;
    }
    .about #slider li, .about #slider li img {
        width: 570px !important;
        height: 239px !important;
    }
    #wrapper.casestudy {
        width:680px;
    }
    .casestudy #single {
        width:680px;
        height:383px;
    }
    .casestudy #controls_single {
		/*
        position: absolute;
        top: 1px;
        right: 0;
        float: none;
		*/
    }
    .casestudy .divider {
        margin: 0 0 45px 0
    }
    .casestudy #window {
        width: auto !important;
    }
    .casestudy #slider {
       /* height: 383px !important; */
    }
    .casestudy #slider li, .casestudy #slider li img, .casestudy #video, .casestudy #video iframe {
       /* 
		width:680px !important;
        height:383px !important;
		*/
    }
    .casestudy .description {
        margin-bottom:15px;
    }
    #blog_header {
        width: 680px;
		display: none;
    }
    #entry {
        width: 100%;
    }
    #entry #body {
        width: 430px;
    }
    #member_data {
        width: 215px;
    }
    #entry #image img {
        width: 680px;
    }
    #comment_holder #comment_and_share {
        width: 680px;
    }
	#entry #thumbnail { float: none; }
    #entry #thumbnail img {
        width:100%;
		text-align: center;
    	margin: 0 auto;
    }
    #comment_holder #comment_and_share #share {
        margin-top: 30px;
    }
    #lux_peek {
        margin: 0 5px -2px 0;
        background-size: 200px auto;
        background-repeat: no-repeat;
        width: 200px;
        height: 84px;
    }
    #entry #text {
        max-width: 550px;
	    width: 100%;
        margin-left: -20px;
		margin: 0 auto;
	    float: none;
    }
    .header_about {
        height:264px;
    }
    #content {
        padding-top: 30px;
    }
}

/* iphone portrait and landscape */
 @media only screen and (max-width: 680px) {
    .index #copyright {
        right: inherit;
        text-align: center;
        width: 100%;
        bottom: 0;
        margin-bottom: 0;
    }
    .content_wrapper {
        margin-top:55px;
    }
    #header {
        height: 55px;
    }
    #lux_logo a.logo_image {
        width: 250px;
        left: 5px;
    }
    #offset {
        margin: 0 auto;
    }
    #menu, #search, #filters {
        display:none;
    }
    #menu {
        background: #ea0079;
        padding:0;
        right: 15px;
        top: 65px;
        color: #1f1f1f;
        width:100%;
    }
    #menu li {
        float:none;
        text-align:center;
        width:100%;
        margin:0 auto;
    }
    #menu a:link, #menu a:active, #menu a:visited, #menu a:hover, #menu .menu_selected a:link, #menu .menu_selected a:active, #menu .menu_selected a:visited, #menu .menu_selected a:hover {
        color: #fff;
        margin:15px auto;
        display:block;
        font-weight: bold;
    }
    #menu_icon {
        display:block;
    }
    .about #content_left {
        width: 290px !important;
    }
    h2.about {
        font-size: 22px !important;
        padding:0 0 60px !important;
    }
    #animals li {
        float:none !important;
        margin: 0 auto !important;
        width: 160px;
    }
    #list_featured_tabs {
        width:auto !important;
    }
    #list_featured_tabs li {
        height: 30px !important;
        width:97px !important;
    }
    .about.awards .page {
        width: 100% !important;
    }
    #award_descriptions {
        float:none !important;
        margin-left: 20px !important;
    }
    #award_thumbnails {
        float:none !important;
        margin-left: 0 !important;
    }
    #socialBox {
        margin:25px auto !important;
        float:none !important;
    }
    #info {
        padding: 0 7px 0 10px !important;
    }
    #wrapper.contact {
        width: 100% !important;
    }
    #contactForm, #info {
        float:none !important;
        margin:25px auto !important;
    }
    #contactForm, .toggles {
        width:280px !important;
    }
    #toggle1, #toggle2 {
        font-size: 14px !important;
    }
    #name, #email, #company, textarea {
        width: 260px !important;
    }
    #submit {
        /*margin: 10px auto 10px 105px !important;*/
    }
    #map {
        height:220px !important;
    }
    #mission {
        width: 98% !important;
        margin: 25px 10px !important;
    }
    #mission #mission_text {
        font-size: 1.0em !important;
    }
    .contact .page {
        width: 100% !important;
    }
    #mainWrapper {
        overflow: hidden !important;
    }
    .about.index .page, .about.clients .page {
        width: 98% !important;
    }
    .about #window {
        width: 290px !important;
        margin-left: -5px;
    }
    .about #slider {
        height: 121px !important;
    }
    .about #slider li, .about #slider li img {
        width: 290px !important;
        height: 121px !important;
    }
    .about .text_content h2 {
        margin-left: -5px;
    }
    #about_tabs {
        margin-left: -3px;
    }
    #wrapper.casestudy {
        width:290px;
    }
    .casestudy #controls_single {
		/*
        position: absolute;
        top: -30px;
        right: 0;
        float: none;
		*/
    }
    .casestudy #pages_single {
        margin-top: 0;
        padding-top: 10px;
    }
    .casestudy #single_title {
        margin-bottom: 0;
        padding-top: 10px;
        width: 100%;
        height: auto;
    }
    .casestudy h1 {
        display: block;
        height: auto;
    }
    .casestudy h5 {
        display: inline-block;
        margin-left: 0;
    }
    .casestudy #single {
        width:290px;
        height:auto;
    }
    #view_video, #view_images, .nav_link {
        float: none;
        height: auto;
    }
    .casestudy .divider {
        margin: 0 0 10px 0
    }
    .casestudy #window {
        width: auto !important;
        margin-bottom: 10px;
    }
    .casestudy #slider {
        /* height: 163px !important; */
    }
    .casestudy #slider li, .casestudy #slider li img, .casestudy #video, .casestudy #video iframe {
     /*
		width:290px !important;
        height:163px !important;
	*/
    }
    #image_control {
        position: absolute;
        top: 163px;
        right: 0;
        float: none;
        padding-top: 10px;
    }
    .casestudy .description {
        width: 90%;
        float: none;
        margin-bottom:15px;
    }
    .casestudy #sidebar {
        width: 90%;
        float:none;
        margin:0;
    }
    #left, #right {
        display:none !important;
    }
    #blog_header {
        width: 95%;
        clear: both;
        margin: 0 auto;
        overflow: visible;
		display: none;
    }
    #blog_header h1 {
        font-size: 18px;
        padding: 10px 0;
    }
    #entry {
        width: 100%;
    	margin: 0 auto;
    }
    #entry #body {
        width: 83%;
        margin:0 auto 20px 8%;
    }
    #entry #text {
        padding-left: 0;
        width: 80%;
    	margin: 0 auto 0 9%;
    }
    #member_data {
        width: 83%;
        margin:0 auto 20px 8%;
    }
    #entry #image img {
        width:100%;
        margin:0 auto;
    }
    #comment_holder #comment_and_share {
        width: 83%;
        margin:0 auto 20px 8%;
    }
	#entry #thumbnail { float: none; }
    #entry #thumbnail img {
        width:99%;
        margin:0 auto;
    }
    #comment_holder #comment_and_share #share {
        margin:0 auto;
    }
    #comment_holder #comment_and_share #comment_form {
        width: 100%;
    }
    #lux_peek {
        display:none;
    }
    #entry #text .center {
        width: 100%;
    }
    .header_about {
        height:220px;
        background-position:-475px 0;
    }
    .logo {
        float:none;
        margin: 0 auto;
    }
    #content {
        padding-top: 30px;
    }
}