.container_12,.container_16{margin-left:auto;margin-right:auto;width:960px}.grid_1,.grid_2,.grid_3,.grid_4,.grid_5,.grid_6,.grid_7,.grid_8,.grid_9,.grid_10,.grid_11,.grid_12,.grid_13,.grid_14,.grid_15,.grid_16{display:inline;float:left;margin-left:10px;margin-right:10px}.container_12 .grid_3,.container_16 .grid_4{width:220px}.container_12 .grid_6,.container_16 .grid_8{width:460px}.container_12 .grid_9,.container_16 .grid_12{width:700px}.container_12 .grid_12,.container_16 .grid_16{width:940px}.alpha{margin-left:0}.omega{margin-right:0}.container_12 .grid_1{width:60px}.container_12 .grid_2{width:140px}.container_12 .grid_4{width:300px}.container_12 .grid_5{width:380px}.container_12 .grid_7{width:540px}.container_12 .grid_8{width:620px}.container_12 .grid_10{width:780px}.container_12 .grid_11{width:860px}.container_16 .grid_1{width:40px}.container_16 .grid_2{width:100px}.container_16 .grid_3{width:160px}.container_16 .grid_5{width:280px}.container_16 .grid_6{width:340px}.container_16 .grid_7{width:400px}.container_16 .grid_9{width:520px}.container_16 .grid_10{width:580px}.container_16 .grid_11{width:640px}.container_16 .grid_13{width:760px}.container_16 .grid_14{width:820px}.container_16 .grid_15{width:880px}.container_12 .prefix_3,.container_16 .prefix_4{padding-left:240px}.container_12 .prefix_6,.container_16 .prefix_8{padding-left:480px}.container_12 .prefix_9,.container_16 .prefix_12{padding-left:720px}.container_12 .prefix_1{padding-left:80px}.container_12 .prefix_2{padding-left:160px}.container_12 .prefix_4{padding-left:320px}.container_12 .prefix_5{padding-left:400px}.container_12 .prefix_7{padding-left:560px}.container_12 .prefix_8{padding-left:640px}.container_12 .prefix_10{padding-left:800px}.container_12 .prefix_11{padding-left:880px}.container_16 .prefix_1{padding-left:60px}.container_16 .prefix_2{padding-left:120px}.container_16 .prefix_3{padding-left:180px}.container_16 .prefix_5{padding-left:300px}.container_16 .prefix_6{padding-left:360px}.container_16 .prefix_7{padding-left:420px}.container_16 .prefix_9{padding-left:540px}.container_16 .prefix_10{padding-left:600px}.container_16 .prefix_11{padding-left:660px}.container_16 .prefix_13{padding-left:780px}.container_16 .prefix_14{padding-left:840px}.container_16 .prefix_15{padding-left:900px}.container_12 .suffix_3,.container_16 .suffix_4{padding-right:240px}.container_12 .suffix_6,.container_16 .suffix_8{padding-right:480px}.container_12 .suffix_9,.container_16 .suffix_12{padding-right:720px}.container_12 .suffix_1{padding-right:80px}.container_12 .suffix_2{padding-right:160px}.container_12 .suffix_4{padding-right:320px}.container_12 .suffix_5{padding-right:400px}.container_12 .suffix_7{padding-right:560px}.container_12 .suffix_8{padding-right:640px}.container_12 .suffix_10{padding-right:800px}.container_12 .suffix_11{padding-right:880px}.container_16 .suffix_1{padding-right:60px}.container_16 .suffix_2{padding-right:120px}.container_16 .suffix_3{padding-right:180px}.container_16 .suffix_5{padding-right:300px}.container_16 .suffix_6{padding-right:360px}.container_16 .suffix_7{padding-right:420px}.container_16 .suffix_9{padding-right:540px}.container_16 .suffix_10{padding-right:600px}.container_16 .suffix_11{padding-right:660px}.container_16 .suffix_13{padding-right:780px}.container_16 .suffix_14{padding-right:840px}.container_16 .suffix_15{padding-right:900px}html body div.clear,html body span.clear{background:none;border:0;clear:both;display:block;float:none;font-size:0;margin:0;padding:0;overflow:hidden;visibility:hidden;width:0;height:0}.clearfix:after{clear:both;content:'.';display:block;visibility:hidden;height:0}.clearfix{display:inline-block}* html .clearfix{height:1%}.clearfix{display:block}



/* The Following code makes the site responsive */

/* #Tablet */

@media only screen and (min-width: 768px) and (max-width: 999px) {

    body {
        min-width: 768px;
    }
  
    /* `Containers */
    
    .container_12 {
      margin-left: auto;
      margin-right: auto;
      width: 768px;
    }
    
    /* `Grid >> Global */
    
    .grid_1,
    .grid_2,
    .grid_3,
    .grid_4,
    .grid_5,
    .grid_6,
    .grid_7,
    .grid_8,
    .grid_9,
    .grid_10,
    .grid_11,
    .grid_12 {
      display: inline;
      float: left;
      margin-left: 10px;
      margin-right: 10px;
    }
    
    .push_1, .pull_1,
    .push_2, .pull_2,
    .push_3, .pull_3,
    .push_4, .pull_4,
    .push_5, .pull_5,
    .push_6, .pull_6,
    .push_7, .pull_7,
    .push_8, .pull_8,
    .push_9, .pull_9,
    .push_10, .pull_10,
    .push_11, .pull_11 {
      position: relative;
    }
    
    /* `Grid >> Children (Alpha ~ First, Omega ~ Last) */
    
    .alpha {
      margin-left: 0;
    }
    
    .omega {
      margin-right: 0;
    }
    
    /* `Grid >> 12 Columns */
    
    .container_12 .grid_1 { width: 44px; }
    .container_12 .grid_2 { width: 108px; }
    .container_12 .grid_3 { width: 172px; }
    .container_12 .grid_4 { width: 236px; }
    .container_12 .grid_5 { width: 300px; }
    .container_12 .grid_6 { width: 364px; }
    .container_12 .grid_7 { width: 428px; }
    .container_12 .grid_8 { width: 492px; }
    .container_12 .grid_9 { width: 556px; }
    .container_12 .grid_10 { width: 620px; }
    .container_12 .grid_11 { width: 684px; }
    .container_12 .grid_12 { width: 748px; }
    
    /* `Prefix Extra Space >> 12 Columns */
    
    .container_12 .prefix_1 { padding-left: 64px; }
    .container_12 .prefix_2 { padding-left: 128px; }
    .container_12 .prefix_3 { padding-left: 192px; }
    .container_12 .prefix_4 { padding-left: 256px; }
    .container_12 .prefix_5 { padding-left: 320px; }
    .container_12 .prefix_6 { padding-left: 384px; }
    .container_12 .prefix_7 { padding-left: 448px; }
    .container_12 .prefix_8 { padding-left: 412px; }
    .container_12 .prefix_9 { padding-left: 576px; }
    .container_12 .prefix_10 { padding-left: 640px; }
    .container_12 .prefix_11 { padding-left: 704px; }
    
    /* `Suffix Extra Space >> 12 Columns */
    
    .container_12 .suffix_1 { padding-right: 64px; } 
    .container_12 .suffix_2 { padding-right: 128px; }
    .container_12 .suffix_3 { padding-right: 192px; }
    .container_12 .suffix_4 { padding-right: 256px; }
    .container_12 .suffix_5 { padding-right: 320px; } 
    .container_12 .suffix_6 { padding-right: 384px; } 
    .container_12 .suffix_7 { padding-right: 448px; } 
    .container_12 .suffix_8 { padding-right: 512px; } 
    .container_12 .suffix_9 { padding-right: 576px; } 
    .container_12 .suffix_10 { padding-right: 660px; } 
    .container_12 .suffix_11 { padding-right: 704px; }
    
    /* `Push Space >> 12 Columns */
    
    .container_12 .push_1 { left: 64px; } 
    .container_12 .push_2 { left: 128px; } 
    .container_12 .push_3 { left: 192px; } 
    .container_12 .push_4 { left: 256px; } 
    .container_12 .push_5 { left: 320px; }
    .container_12 .push_6 { left: 384px; } 
    .container_12 .push_7 { left: 448px; } 
    .container_12 .push_8 { left: 512px; } 
    .container_12 .push_9 { left: 576px; }
    .container_12 .push_10 { left: 640px; } 
    .container_12 .push_11 { left: 708px; }
    
    /* `Pull Space >> 12 Columns */
    
    .container_12 .pull_1 { left: -64px; } 
    .container_12 .pull_2 { left: -128px; } 
    .container_12 .pull_3 { left: -192px; } 
    .container_12 .pull_4 { left: -256px; } 
    .container_12 .pull_5 { left: -320px; } 
    .container_12 .pull_6 { left: -384px; } 
    .container_12 .pull_7 { left: -448px; } 
    .container_12 .pull_8 { left: -512px; } 
    .container_12 .pull_9 { left: -576px; } 
    .container_12 .pull_10 { left: -640px; } 
    .container_12 .pull_11 { left: -704px; }
    
    /* `Element fixes */
    
    /* Main wraper */
    #wraper {
        width: 788px !important;
    }
    
    /* Slider */
    #slider {
        width: 728px !important;
    }
    
    /* Portfolio thumbs */
    #recentWork .imageWraper a,
    #portfolio .imageWraper a {
        width: 215px !important;
        height: auto !important;
    }
    
    /* Portfolio thumbs img size */
    #recentWork .imageWraper img,
    #portfolio .imageWraper img {
        width: 215px !important;
        height: auto !important;
    }
    
    /* Hide hover feature for tablets */
    #recentWork .imageWraper span,
    #portfolio .imageWraper span {
        display: none !important;
        width: 0px !important;
        height: 0px !important;
    }
    
    /* Fix input size in footer form */
    #footerContact input[type="text"],
    #footerContact textarea {
        width: 260px !important;
    }
    
    /* Fixes width top search bar size */
    #pageHeader #topSearch input {
	    width: 200px !important;
    }
    
    /* Post image size fix */
    
    .blogPost .post-thumbnail img {
	    width: 470px !important;
	    height: auto !important;
    }
    
    /* Fixes tabs */ 
    .tabs .selectors { width: 235px !important; }
    .tabs .selectors li.twitter a { padding-left: 0 !important; background: none !important;}
    
    /* Case study large image fix */
    #caseStudy #largeImage img {
		width: 472px !important;
		height: auto;
	}
	
	/* Contact page map/textarea fix */
	#contact #map iframe { width: 344px !important; }
	#contact textarea { width: 334px !important; }
    
  
  
}

/*  #Mobile */

@media only screen and (max-width: 767px) {
    
    body {
        min-width: 440px;
    }
  
    /* `Containers */
    
    .container_12 {
      margin-left: auto;
      margin-right: auto;
      width: 440px;
    }
    
    /* `Grid >> Global */
    
    .grid_1,
    .grid_2,
    .grid_3,
    .grid_4,
    .grid_5,
    .grid_6,
    .grid_7,
    .grid_8,
    .grid_9,
    .grid_10,
    .grid_11,
    .grid_12 {
      width: 420px !important;
      margin-left: 10px;
      margin-right: 10px;
    }
    
    .alpha,
    .omega {
      margin-left: 0;
      margin-right: 0;
    }
    
    .align_center,
    .align_right {
      text-align: left;
    }
    
    /* element fix */
    
    /* Wraper */
    #wraper { width: 460px !important; }
    
    /* Header/nav */
    header { height: 245px !important; }
    header nav#main { height: auto !important; }
    header nav#main ul { float: none; height: auto !important; }
    header nav#main li {
	    height: 50px !important;
	    line-height: 50px !important;
	    background: #f9f9f9;
    }
    
    /* Hide slider for better mobile performance */
    #sliderWraper { display: none; }
    
    /* slogan margin fix */
    #homeSlogan { overflow: hidden; margin-top: 30px; margin-bottom: 40px !important;}
    
    /* home services margin fix */
    #homeServices #web,
    #homeServices #graphic,
    #homeServices #strategy {
	    margin-top: 20px;
    }
    
    /* Page header margin fix */
    #pageHeader {
	    height: 140px !important;
	    line-height: 1 !important;
    }
        
    #pageHeader #pageTitle { height: 30px !important; padding: 20px 0; }
    #pageHeader #pageTitle h1 { line-height: 1 !important; }
    #pageHeader #topSearch { margin-bottom: 20px; }
    
    /* Post image size fix */
    
    .blogPost .post-thumbnail img {
	    width: 396px !important;
	    height: auto !important;
    }
    
    /* Sidebar top margin fix */
    aside#sidebar { margin-top: 60px;}
    
    /* Reply textarea size fix */
    #reply textarea { width: 390px !important; }
    
    /* Case study large image fix */
    #caseStudy #largeImage img { width: 400px !important; }
    
    /* Footer copyright */
    #footerBarWraper { height: auto !important; }
    #footerBar #social ul { float: none !important;}
    
    /* Contact page map/textarea fix */
	#contact #map iframe { width: 400px !important; }
	#contact textarea { width: 390px !important; }
	#contact #contactForm { margin-bottom: 30px;}
    
}