/*!
 *
 * GMG CoZone Reponisve Additions
 *
 */
@media (max-width: 767px) {
  body {
    padding-left: 0px;
    padding-right: 0px;
  }
  #content {
    padding-left: 20px;
    padding-right: 20px;
  }
  #footer {
    padding-left: 20px;
    padding-right: 20px;
    /*
     ul.pull-right {
  		float:none;  
  	}
  */
  
    /*
  .copyright {
  	  display: none;
  	}
  */
  
  }
  .navbar-fixed-top,
  .navbar-fixed-bottom {
    margin-left: 0px;
    margin-right: 0px;
  }
  .container-fluid {
    padding: 0;
  }
  .wizard-steps span {
    display: none;
  }
  #centered-column {
    width: auto;
  }
  #login-banner {
    padding-right: 0;
  }
  #login-form {
    border-left: 0;
    padding-left: 0;
  }
  /*
  	.btn-toolbar {
  			.btn-group {
  				span {
  					display: none;
  				}
  			}
  		}
  	*/
  .widget-header .widget-links {
    float: right;
    font-size: 11px;
    line-height: 50px;
    margin: 0;
    list-style: none;
    padding: 0;
    text-shadow: 1px 1px 0 rgba(255, 255, 255, 0.75);
    text-transform: uppercase;
  }
  .widget-header .widget-links li {
    display: inline;
    padding: 3px 20px 3px;
  }
  .widget-header .widget-links li a {
    color: #555555;
    font-weight: bold;
  }
  .widget-header .widget-links li a:hover {
    color: #a90d3c;
  }
  .dropzone {
    margin-right: 0%;
  }
  .a-user-selector.compact.newApproval {
    margin-right: 0;
  }
  .a-user-selector .block-grid.one-up,
  .a-user-selector .block-grid.two-up,
  .a-user-selector .block-grid.three-up {
    margin: 0;
    margin: 0 -8px;
  }
  .a-user-selector .block-grid.one-up > li,
  .a-user-selector .block-grid.two-up > li,
  .a-user-selector .block-grid.three-up > li {
    width: 100%;
    padding: 0 0 15px;
    padding: 0 8px 8px;
  }
  .blank-state .blank-state-icon {
    text-align: center;
  }
  .blank-state h3 {
    text-align: center;
    margin: -10px 0 5px;
  }
  .blank-state p {
    text-align: center;
  }
  .blank-state .btn {
    text-align: center;
  }
  table.responsive {
    margin-bottom: 0;
  }
  .pinned {
    position: absolute;
    left: 0;
    top: 0;
    background: #fff;
    width: 35%;
    overflow: hidden;
    overflow-x: scroll;
    border-right: 1px solid #ddd;
    border-left: 0px solid #ddd;
  }
  .pinned table {
    border-right: none;
    border-left: none;
    width: 100%;
  }
  .pinned table th,
  .pinned table td {
    white-space: nowrap;
  }
  .pinned td:last-child {
    border-bottom: 0;
  }
  div.table-wrapper {
    position: relative;
    margin-bottom: 20px;
    overflow: hidden;
    border-right: 1px solid #ddd;
  }
  div.table-wrapper div.scrollable table {
    margin-left: 35%;
  }
  div.table-wrapper div.scrollable {
    overflow: scroll;
    overflow-y: hidden;
  }
  table.responsive td,
  table.responsive th {
    position: relative;
    white-space: nowrap;
    overflow: visible;
  }
  table.responsive th:first-child,
  table.responsive td:first-child,
  table.responsive td:first-child,
  table.responsive.pinned td {
    display: none;
  }
}
@media (max-width: 480px) {
  #centered-column {
    width: auto;
  }
  .a-user-selector li {
    margin: 0 0% 1% 0;
    width: 100%;
  }
  .dropzone {
    margin-right: 0%;
  }
  #tablet-delete, 
  #tablet-details,
  #tablet-access, 
  #tablet-share, #tablet-view-type
  /*#tablet-approvals-sidebar */
  {
      display: none;
  }
  #tablet-proof-studio,
  #tablet-approvals-sidebar,
  #tablet-approvaldetails-back,
  #tablet-settings 
  {
      font-size: 2.5em;
  }
}
@media (min-width: 768px) and (max-width: 979px) {
  .a-user-selector.compact.newApproval {
    margin-right: 180px;
  }
  .a-user-selector.compact.newApproval .block-grid.one-up,
  .a-user-selector.compact.newApproval .block-grid.two-up,
  .a-user-selector.compact.newApproval .block-grid.three-up {
    margin: 0;
    margin: 0 -8px;
  }
  .a-user-selector.compact.newApproval .block-grid.one-up > li,
  .a-user-selector.compact.newApproval .block-grid.two-up > li,
  .a-user-selector.compact.newApproval .block-grid.three-up > li {
    width: 100%;
    padding: 0 0 15px;
    padding: 0 8px 8px;
  }
  .nav-colored > li > a {
    padding-right: 0px;
  }
  .nav-colored .badge {
    display: none;
  }
  /*End (min-width: 768px) and (max-width: 979px) */
}
@media (max-width: 979px) {
  .nav-collapse .nav .nav-header {
    color: #555555;
  }
  .nav-collapse .nav > li > a,
  .nav-collapse .dropdown-menu a {
    color: #555555;
  }
}
/************************ Home page styles *******************/
@media (min-width: 1200px)
{
    .collaboratePhoto {
        background-image: url("../img/collab-icon-200x200.png");
    }
    .deliverPhoto {
        background-image: url("../img/deliver-icon-200x200.png");
    }     
    .module-photo {
        width: 200px;
        height: 200px;
    }
}
@media (max-width: 1199px) 
{
    .collaboratePhoto {
        background-image: url("../img/collab-icon-150x150.png");
    }
    .deliverPhoto {
        background-image: url("../img/deliver-icon-150x150.png");
    }      
    .module-photo {
        width: 150px;
        height: 150px;
    }
}


@media (min-width: 1200px)
{
    #originalFileName 
    {
        max-width: 400px;    
    }
    .module-container
    {
        margin-right: 100px;
        margin-top:35px;
    }
    .modulesAndVideos
    {
        width:850px;
        max-height:800px;
        overflow: hidden;
    }
    .videos-container {
        width: 840px !important;
    }
    .youtubeVideoSpan {
        width: 375px;
        min-height: 240px !important;
    }
}
@media (min-width: 980px) and (max-width: 1200px)
{
    .module-container
    {
        margin-right: 60px;
        margin-top:35px;
    }
    .modulesAndVideos
    {
        width:620px;
        max-height:800px;
        overflow: hidden;
    }
    .videos-container {
        width: 610px !important;
    }
    .youtubeVideoSpan {
        width: 260px;
        min-height: 240px !important;
    }
}
@media (min-width: 780px) and (max-width: 979px)
{
    #originalFileName
    {
        max-width: 200px;    
    }
    .module-container
    {
        margin-top:35px;
    }
    .modulesAndVideos
    {
        width: auto;
        height: auto;
        background-color: white;
    }
    .modules-containers {
        
        width: auto;
        margin-left: auto;
        margin-right: auto;
    }
    .modules-containers {
        height: 260px;
    }
    .youtubeVideoSpan {
        width: auto;
        min-height: 240px !important;
    }
    .youtubeVideoSpan:last-child {
        margin-left: 0px !important;
    }
    .modules-announcements {
        width: 175px;
    }
}
@media (max-width: 779px)
{
    .module-container
    {
        margin-top:35px;
    }
    .modulesAndVideos
    {
        width: auto;
        height: auto;
        background-color: white;
        float: none;
    }
    .modules-containers {
        
        width: auto;
        margin-left: auto;
        margin-right: auto;
    }
    .modules-containers {
        height: auto;
    }
    .youtubeVideoSpan {
        width: auto;
        min-height: 240px !important;
    }
    .youtubeVideoSpan:last-child {
        margin-left: 0px !important;
        margin-top: 20px;
    }
    .modules-announcements 
    {
        width: auto;
        float: none;
    }
    div.videos-container div.pull-left {
        float: none;
    }
    div.videos-container div.pull-right {
        float: none;
    }
}
/*************************************************************/
@media (min-width: 1200px)
{
    .widget-content .permissionRoleSpacing {
        margin-right: 100px !important;
    }
}
@media (min-width: 980px) and (max-width: 1199px)
{
    .widget-content .permissionRoleSpacing {
        margin-right: 65px !important;
    }
}
@media (min-width: 801px) and (max-width: 979px)
{
    .widget-content .permissionRoleSpacing {
        margin-right: 20px !important;
    }
}
@media (max-width: 800px)
{
    #originalFileName 
    {
        max-width: 200px;
    }
    .widget-content .permissionRoleSpacing {
        margin-right: 10px !important;
    }
}
.modal-body .permissionRoleSpacing 
{
    margin-right: 30px !important;
}
.video-link-container
{
    width:48%;
    margin-right:4px;
    margin-top:35px;
}
@media (max-width: 680px) 
{
    .jobDetails #SpotColors{
        width: auto !important;
    }
}
@media (max-width: 1199px) and (min-width: 980px)
{
    .approvals-left-navigation .form-search #txtSearch {
        width: 110px;
    }
}
@media (max-width: 979px) and (min-width: 768px) 
{
    .approvals-left-navigation .form-search #txtSearch {
        width: 55px;
    }
}
@media (min-width: 1200px)
{
    .approvals-left-navigation .form-search #txtSearch {
        width: 160px;
    }
}

@media (min-width: 1200px) 
{
    .softproofing-reports .span3 .chzn-container, .softproofing-reports .span3 .chzn-drop {
        width: 180px !important;
    }
}
@media (max-width: 1199px) and (min-width: 980px)
{
    .softproofing-reports .span3 .chzn-container, .softproofing-reports .span3 .chzn-drop {
        width: 150px !important;
    }
}
@media (max-width: 979px) and (min-width: 768px)
{
    .softproofing-reports .span3 .chzn-container, .softproofing-reports .span3 .chzn-drop {
        width: 100px !important;
    }
}

@media (min-width: 1200px) 
{
    .spanPermissions {
        width: 350px !important;
    }
    
    .sharedWfOwnerInfo 
    {
        float: left;
        margin-left: 80px !important;
    }
}
@media (max-width: 1199px) and (min-width: 980px)
{
    .spanPermissions {
        width: 270px !important;
    }
    .inputUsers 
    {
        width: 150px;
    }
    
    .sharedWfOwnerInfo 
    {
        float: left;
        margin-left: 15px !important;
    }
}
@media (max-width: 979px) and (min-width: 768px)
{
    .spanPermissions {
        display: block;
        float: none;
    }
    
    .sharedWfOwnerInfo 
    {
        float: left;
        margin-left: 0px !important;
    }
}

@media(max-width: 375px) 
{
    #login-form .input-xlarge {
        width: 115%;
    }
    
    .logo {
        width: 80%;
    }
    
    #login-form .control-group small {
        float: left;
    }
    
    #login-form .control-group label {
        width: 100%;
    }   
    
    div.alert.alert-error {
        width: 90% !important;
    }
  .nav-collapse.in.collapse {
    height: auto !important;
    overflow: visible !important;
  }    
}