/** Shopify CDN: Minification failed

Line 325:2 Expected "}" to go with "{"

**/
/* -------------------------------------------------------------------------------- */
/* Custom Frame Layout */
/* -------------------------------------------------------------------------------- */
h1{
    margin-bottom: 17px;
  }
  .main-content{
    margin-top: -20px !important;
  }
  
  .NoFrame{
    height: 60px;
  }
  
  
  .tip{
    font-size:12px;
    margin: 15px;
    float:left;
  }
  .shippingNext{ 
    text-align: center;
  display: block;
  width: 150px;
  float: right;
  height: 40px;
  background-color: #9D0914;
  line-height: 40px;
  color: white;
    margin-top:10px;
    
  }
  .shippingNext:hover{ 
    cursor: pointer; 
    opacity: 0.9;
  }

  button:disabled,
button[disabled]{
    opacity: 0.5
}

  ul{
      list-style: none;
      padding:0;
  }

  ul li{
      margin-bottom:15px;
  }

  .page-content{
      margin: 10px !important;
  }
  
  #file { display: none; }
  #frameForm { width: 50%; margin: 6px 0 20px 0; position: relative; }
  
  #frameCustom { padding: 0; margin: 0px 0px 0px 0px; }
  #imagePicker { height: 50px; clear: both; }
  .frameBorder { border-top: 1px solid #333; border-left: 1px solid #333; border-right: 1px solid #CCC; border-bottom: 1px solid #CCC;}
  
  #frameOuter { position: relative; width: 50%; overflow: hidden; z-index:1; } 
  
  
  
  #pictureWrapper { position: relative; width:100%; display: table;}
  #pictureVert { display: table-cell; vertical-align: middle; }
  #pictureHoriz { display: table; width: 50%;}
  
  /*.selectpic { width: 100%; height: auto; position: relative; float: left; margin: 15px 0 20px 0; background: #eee; padding: 20px; box-sizing: border-box; }
  .selectpic button { width:70px; height: 51px!important; border: 0; background-color: transparent!important; background:url(_/images/select-image.png) no-repeat left top!important; }
    .selectpic button:hover {  background-position: bottom right;}
  .selecpic span { float: left; }    */
  
  #imagePicker .button { margin-top: 20px; float: right; }
  #previewimg { display: block; }
  
  .picEdge { overflow: hidden; }
  .picFrame { position: absolute; padding: 0; margin: 0; line-height: 1px;}
  .picFrame img { vertical-align: top; }
  .picCorner { overflow: hidden; display:none;}
  
  #frameLeft { left:0px; top: 0px; z-index: 100;}
  #frameTop { left:0px; top: 0px;  z-index: 999;  -ms-transform: translateY(-100%) rotate(90deg); -moz-transform: translateY(-100%) rotate(90deg); -webkit-transform: translateY(-100%) rotate(90deg); -o-transform: translateY(-100%)rotate(90deg); -webkit-transform-origin: left bottom; -moz-transform-origin: left bottom; -ms-transform-origin: left bottom; -o-transform-origin: left bottom;}
  #frameRight { right:0px; top: 0px;  z-index: 100; -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform:rotate(180deg)}
  #frameBottom { right:0px; bottom: 0px;  z-index: 999; -ms-transform: translateX(100%) rotate(270deg); -moz-transform: translateX(100%) rotate(270deg); -webkit-transform: translateX(100%) rotate(270deg); -o-transform: translateX(100%)rotate(270deg); -webkit-transform-origin: bottom left; -moz-transform-origin: bottom left; -ms-transform-origin: bottom left; -o-transform-origin: bottom left;}
  #cornerTL {  left:0px; top: 0px; z-index: 1901; }
  #cornerTR { top:0px; right: 0px;  z-index: 1901; -ms-transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); }
  #cornerBL {  left:0px; bottom: 0px;  z-index: 1901; -ms-transform: rotate(270deg); -moz-transform: rotate(270deg); -webkit-transform: rotate(270deg); -o-transform: rotate(270deg); }
  #cornerBR {  right:0px; bottom: 0px;  z-index: 1901; -ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg);}
  
  
  #frameMessage {visibility: hidden; display:table; position: absolute; width: 100%; height: 100%; padding:0; margin:0;  background-color:rgba(255,128,128,0.6); color:#000; z-index:102;}
  #drop-files { display:table; position: absolute; width: 100%; height: 100%; padding:0; margin:0; background-color:rgba(0,0,0,0); color:#000; z-index:99;}
  #frameText { display:table-cell; text-align:center;  vertical-align:middle; text-transform: uppercase;}
  
  #frameForm h3 { margin: 20px 0 10px 0; font-size: 14px; padding: 10px; background: #eee; }
  #frameForm input[type=radio] { height: 30px!important; }
  
  .itemPicker {clear:none }
  .framePicker {margin: 10px 0;
  height: 400px;
  position: relative;
  overflow: scroll;}
    .frameWrapper { width: 80%; height: 70px; overflow: hidden; }
      .frameInfo { color: #333333; font-size: 0.7em !important;}
      .framePreview {     overflow: hidden; float:none; vertical-align:top; height: 130px;margin:5px 10px; padding:5px; border:1px solid white;}
      .framePreview:hover {background:#eee; cursor:pointer; border-radius:5px;}
      .framePreview.active {background:#eee; border:1px solid black; border-radius:5px;}
    .framePicker img {height:380px; left:0px; top: 0px; right: 0px; pointer-events: none; -ms-transform: translateY(-100%) rotate(90deg); -moz-transform: translateY(-100%) rotate(90deg); -webkit-transform: translateY(-100%) rotate(90deg); -o-transform: translateY(-100%)rotate(90deg); -webkit-transform-origin: left bottom; -moz-transform-origin: left bottom; -ms-transform-origin: left bottom; -o-transform-origin: left bottom;}
    .frameTitle { height: 30px; font-size:12px; font-weight:bold; color: black; line-height:normal;}
  
  .framePreview .shape-prev {
    float:right; transform: rotate(0deg); position: relative;top: -90px; left: 0px; height:77px
  }
  .NoFrame {
    height:50px;
  }
  
  .colourPicker {display:none; clear:both; padding: 5px; margin: 0px 0 0px 0; overflow:auto;}
    .mountColour { display:block; float: left; clear:none; width:32px; height:32px; border-radius: 5px; margin: 2px; border: 1px solid white;}
    .mountColour { background-size: 100% 100%;}
    .mountColour:hover { border:1px solid red; cursor:pointer;}
    .mountColour.active { border:1px solid black;}
    
  #selectMount { margin: 20px 5px 5px 0px; }
  .cpInput {display: inline-block; width: 100% ; clear: both; margin: 2px 0; }
  .cpInput label { margin-left: 5px; }
  
  /* New Custom Frame Stuff */
  
    .cf-page .page-title {background:#182e49; width:100%; height:40px; cursor: pointer; cursor: hand; border-bottom: 1px solid #fff; }
    .cf-page .page-title:hover, .cf-page .page-title.active { background: #9D0914; }
        .cf-page .page-title h2 {color:#fff; padding:0px 10px; line-height:40px; margin:0;}
        .cf-page .page-content { max-height:500px; overflow: auto; padding-bottom:10px;}
        .cf-page .page-content input { width:100px; }
        .cf-page .page-content label { display: inline-block; width: auto;   }
        .cf-page .page-content label input { float:left; margin-right: 5px; margin-left: 5px; }
  
  #cf_totals {background:#eee; width:100%; height:auto;}

  /* Accessories checkboxes */
  #accessories input[type="checkbox"] {
    width: 20px;
    height: 20px;
    margin-right: 10px;
    vertical-align: middle;
  }
  #accessories label {
    cursor: pointer;
    font-size: 15px;
  }
  #accessories ul li {
    padding: 5px 0;
  }
  #accessories li.disabled {
    opacity: 0.5;
  }
  #accessories li.disabled label {
    cursor: not-allowed;
    color: #999;
  }
  #accessories li.disabled input[type="checkbox"] {
    cursor: not-allowed;
  }
  
  
  /* -------------------------------------------------------------------------------- */
  /* Colorbox  */
  /* -------------------------------------------------------------------------------- */
  .gallery { width: 100%; }
  .gallery-item { display: block; background: #eee; padding: 10px; margin: 0 20px 2% 0; width: 41%!important; box-sizing: border-box; border: 1px solid #ccc; }
  .gallery-icon { display: block!important; width: 100%!important; }
  .gallery-icon img { border: none!important; }
  .gallery p { display: none; }
  
  .gallery-caption { color:#666; font-style:italic; font-size:14px; line-height: 18px; }
  
  /*
      Colorbox Core Style:
      The following CSS is consistent between example themes and should not be altered.
  */
  
  #colorbox, #cboxOverlay, #cboxWrapper{position:absolute; top:0; left:0; z-index:9999; overflow:hidden;}
  #cboxOverlay{position:fixed; width:100%; height:100%;}
  #cboxMiddleLeft, #cboxBottomLeft{clear:left;}
  #cboxContent{position:relative;}
  #cboxLoadedContent{overflow:auto; -webkit-overflow-scrolling: touch;}
  #cboxTitle{margin:0;}
  #cboxLoadingOverlay, #cboxLoadingGraphic{position:absolute; top:0; left:0; width:100%; height:100%;}
  #cboxPrevious, #cboxNext, #cboxClose, #cboxSlideshow{cursor:pointer;}
  .cboxPhoto{float:left; margin:auto; border:0; display:block; max-width:none; -ms-interpolation-mode:bicubic;}
  .cboxIframe{width:100%; height:100%; display:block; border:0;}
  #colorbox, #cboxContent, #cboxLoadedContent{box-sizing:content-box; -moz-box-sizing:content-box; -webkit-box-sizing:content-box;}
  
  /* 
      User Style:
      Change the following styles to modify the appearance of Colorbox.  They are
      ordered & tabbed in a way that represents the nesting of the generated HTML.
  */
  
  #cboxOverlay{background:#000;}
  #colorbox{outline:0;}
      #cboxContent{margin-top:20px;background:#000;}
          .cboxIframe{background:#fff;}
          #cboxError{padding:50px; border:1px solid #ccc;}
          #cboxLoadedContent{border:5px solid #000; background:#fff;}
          #cboxTitle{position:absolute; top:-20px; left:0; color:#ccc;}
          #cboxCurrent{position:absolute; top:-20px; right:0px; color:#666; font-size: 14px; text-transform: uppercase; }
          #cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
  
          /* these elements are buttons, and may need to have additional styles reset to avoid unwanted base styles */
          #cboxPrevious, #cboxNext, #cboxSlideshow, #cboxClose {border:0; padding:0; margin:0; overflow:visible; width:auto; background:none; }
          
          /* avoid outlines on :active (mouseclick), but preserve outlines on :focus (tabbed navigating) */
          #cboxPrevious:active, #cboxNext:active, #cboxSlideshow:active, #cboxClose:active {outline:0;}
          
          #cboxSlideshow {position:absolute; top:-20px; right:90px; color:#fff;}
          
          #cboxPrevious, #cboxNext {position:absolute; top:50%; margin-top:-25px; background:url('_/images/pag.png') no-repeat bottom left!important; width:50px!important; height:50px!important; text-indent:-9999px;}
          #cboxPrevious {left:5px; }
          #cboxPrevious:hover{background-position: top right!important;}
                  
          #cboxNext {right: 5px; background-position: top left!important; }
          #cboxNext:hover{background-position:bottom right!important;}
          
          #cboxClose{position:absolute; top:5px; right:5px; display:block; background:url('_/images/close.png') no-repeat top center!important; width:25px!important; height:25px!important; text-indent:-9999px;}
          #cboxClose:hover{background-position:bottom center!important;}
          
          
  #NoScript, .chromeframe {position:fixed; top:0; left:0; width:100%; z-index:9999999; background:rgba( 0, 0, 0, 0.8);  text-align:center;}
  
  .chromeframe { background: #333; }
  .chromeframe a { color: #fff; text-decoration: underline; font-weight: bold; }
  
  #NoScript p, .chromeframe p { color:#fff; padding:20px 150px; font-size:16px; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;}
  
  .summary {
    padding-right:40px;
  }
  
  .btn {
      color: white;
      padding:10px;
      background-color:#9D0914;

  }

  
  .btn--upload{
        margin: 0 auto;
      text-align: center;
      zoom: 0.8;
      margin-top: 10px;
      float: right;
      margin-right: 25px
  }
    
  @media screen and (max-width: 1380px) {
  #frameCustom {
  overflow:hidden;
  }
    
    @media screen and (max-width: 1380px){
      #frameOuter { 
        zoom: 1 !important;
      }
    }
  
  @media screen and (max-width: 1031px) {
    #pictureWrapper {
      zoom: 0.6;
    }
    
    .page-content a{
      font-size:10px;
    }
    
   #frameCustom {
     float:none !important;
     width:100% !important;
     overflow:hidden !important;
     
  }
    
    #frameForm{
      float: none !important;
      width: 100% !important;
    }
    
    .summary {
      padding: 0;
      font-size: 14px;
        margin-bottom: 20px;
      }
    
    .main-content {
      padding-top:5px;
      
    }
    
    #selectImage{
      float:none !important;
      margin-right: 0 !important;
      }
    
    #pictureHoriz{
      margin: 0 auto !important;
    }
    
    #priced{
      display:block !important;
      padding: 0px !important;
      zoom: 0.8 !important;
  }
    
  
    
  