/** Shopify CDN: Minification failed

Line 6:541 Unexpected "<"

**/
@import url('https://fonts.googleapis.com/css?family=Roboto|Abril+Fatface|Bangers|Bungee+Inline|Chewy|Creepster|Girassol|Lobster|Love+Ya+Like+A+Sister|Luckiest+Guy|Original+Surfer|Rye|Staatliches|Amatic+SC|Homemade+Apple|Berkshire+Swash|Itim|Kaushan+Script|Marck+Script|Merienda|Pacifico|Pangolin|Patrick+Hand|Permanent+Marker|Sriracha|Yesteryear|B612+Mono|Inconsolata|Nova+Mono|Roboto+Mono|Syne+Mono|Montserrat|Noto+Sans+JP|Open+Sans|Oswald|Poppins|Ubuntu|Raleway|Roboto|Roboto+Condensed|Cinzel|Crimson+Text|DM+Serif+Display|Merriweather');</style>
@font-face {
  font-family: '5th Grade Cursive';
  src: url('https://ottocustomizer.com/app/assets/fonts/5th Grade Cursive.ttf');
}
@font-face {
  font-family: 'Algerian';
  src: url('https://ottocustomizer.com/app/assets/fonts/Algerian.ttf');
}
@font-face {
  font-family: 'American Typewriter';
  src: url('https://ottocustomizer.com/app/assets/fonts/American Typewriter.ttf');
}
@font-face {
  font-family: 'Arial';
  src: url('https://ottocustomizer.com/app/assets/fonts/Arial.ttf');
}
@font-face {
  font-family: 'Arial Black';
  src: url('https://ottocustomizer.com/app/assets/fonts/Arial Black.ttf');
}
@font-face {
  font-family: 'Arial Narrow';
  src: url('https://ottocustomizer.com/app/assets/fonts/Arial Narrow.ttf');
}
@font-face {
  font-family: 'Bernard MT Condensed';
  src: url('https://ottocustomizer.com/app/assets/fonts/Bernard MT Condensed.ttf');
}
@font-face {
  font-family: 'Bradley Hand ITC';
  src: url('https://ottocustomizer.com/app/assets/fonts/Bradley Hand ITC.ttf');
}
@font-face {
  font-family: 'Calling Heart';
  src: url('https://ottocustomizer.com/app/assets/fonts/Calling Heart.ttf');
}
@font-face {
  font-family: 'Comic Sans MS';
  src: url('https://ottocustomizer.com/app/assets/fonts/Comic Sans MS.ttf');
}
@font-face {
  font-family: 'Embassy BT';
  src: url('https://ottocustomizer.com/app/assets/fonts/Embassy BT.ttf');
}
@font-face {
  font-family: 'Beyond Wonderland';
  src: url('https://ottocustomizer.com/app/assets/fonts/Beyond Wonderland.ttf');
}
@font-face {
  font-family: 'Forte';
  src: url('https://ottocustomizer.com/app/assets/fonts/Forte.ttf');
}
@font-face {
  font-family: 'Marquee Moon';
  src: url('https://ottocustomizer.com/app/assets/fonts/Marquee Moon.ttf');
}
@font-face {
  font-family: 'Freehand521 BT';
  src: url('https://ottocustomizer.com/app/assets/fonts/Freehand521 BT.ttf');
}
@font-face {
  font-family: 'Kaufmann BT';
  src: url('https://ottocustomizer.com/app/assets/fonts/Kaufmann BT.ttf');
}
@font-face {
  font-family: 'MeninBlue';
  src: url('https://ottocustomizer.com/app/assets/fonts/MeninBlue.ttf');
}
@font-face {
  font-family: 'Vladimir Script';
  src: url('https://ottocustomizer.com/app/assets/fonts/Vladimir Script.ttf');
}


main{ overflow:hidden; margin-top:-48px;}
.canvas-container{
    max-width:100%;
  }
  .panel_element.active, .panel_element:hover {
    border-left: 4px solid #03a9f4;
    padding-left: 6px;
    margin-right: 10px;
  }
  .cd4_mobile_w{
    border-right: 1px solid #dcdcdc;
  }
  .active_filt {
    background-color: #444 !important;
    color: #fff;
    outline: 1px solid #000;
  }
  #cd4_option_panel_upload_1 .cd4_scrolled_panel {
      height: 80vh;
      overflow-y: scroll;
      overflow-x: hidden;
  }
  .cd4_opacity_sec {
    margin-top: 20px;
  }
  #cd4_imgLoader_for {
    background-color: #03a9f4;
    padding: 25px 80px;
    display: block;
    text-align: center;
    color: #fff;
  }
  #cd4_imgLoader {
     display: none;
  }
  /*input#search_art_txt:focus {
    border:0;
    outline:2px solid #000;
    height: 29px !important;
    width: 68% !important;
  }*/
  .hr_customizer{ margin: 20px 0; background-color: #ececec;}
    .main_container{ font-family: 'Roboto'; position:relative; }
    #main_options_mob{ display:none; }
  	.clearf{ clear:both; }
  	#action_options{
      float:right;
      width:90px;
    }
    .action_panel2 {
      text-align: center;
      background: #f3f3f3;
      padding: 12px;
      font-size: 11.5px;
      color: grey;
      border-bottom: 1px solid #dcdcdc;
      cursor: pointer;
      text-transform: uppercase;
      margin: 0 auto;
     }
    .action_panel2 i {
      font-size: 18px;
      margin-bottom: 8px;
      display: block;
    }
  	#custom_elem img{
      width:100%;
      max-width:367px;
    }
  .menu_panel {
    height: 535px;
    min-width: 80px;
    background-color: #444;
    float: left;
    text-align: center;
    padding: 30px 5px 30px 5px;
    color: #fff;
    width: 110px;
	}
  .menu_panel .panel_txt {
    text-transform: uppercase;
}
  .panel_element {
    cursor: pointer;
    margin-bottom: 30px;
   }
  .option_panel {
    height: 550x;
    width: 420px;
    float: left;
    background-color: #fff;
    border-right: 1px solid #dcdcdc;
    border-bottom: 1px solid #dcdcdc;
	}
  .option_panel_elements {
    margin-bottom: 30px;
    padding: 0 50px;
	}
  #cd4_option_panel_main h2{
  text-align:center;
  }
  .option_element_50 {
    width: 50%;
    float: left;
    text-align: center;
    cursor: pointer;
}
  .option_panel h4 {
    text-align: center;
    margin-bottom: 40px;
}
  .cart_design {
    z-index: 9;
    background-color: #fff;
    padding: 0px 40px 30px;
}
  .add_txt_btn, .cart_design button {
    float: right;
    background-color: #03a9f4;
    border: none;
    color: #fff;
    padding: 15px 32px;
    text-align: center;
    text-decoration: none;
    font-size: 16px;
    margin: 4px 2px;
    cursor: pointer;
    text-transform: uppercase;
}
  .cart_design span {
    padding: 16px;
    font-size: 20px;
    float: left;
}
  #cd4_sidebar_left{
    float: left;
  }
  #custom_elem{
    float: left;
    width: calc(100% - 620px);
  }
  #action_options{
    float: right;
  }
  #custom_elem .align_center{
    text-align:center;
    max-width: 367px;
    margin: 0 auto;
  }
  #sub_options_mob{
    background-color: #f3f3f3;
    padding:5px;
    position: absolute;
    bottom: 0px;
    z-index: 999999;
    width: 100%;
  }
  .canvas-container:nth-child(3){
     display:none;
  }
  .panel_heading span {
    position: absolute;
    top: -20px;
    right: -27px;
    font-family: sans-serif;
    cursor: pointer;
    background: #f7f7f7;
    padding: 5px;
    font-size: 15px;
    z-index: 2;
    width: 25px;
}
  h2.panel_heading{
    position:relative;
    text-align:center;
  }
  #cd4_text_con {
    width: 100%;
    height: 80px;
    font-size: 23px;
}
  .selectbox_customizer {
    width: 100%;
    border: 1px solid #bbb;
    margin-top: 4px;
}
.option_panel a:hover, .panel_element a:hover{
  text-decoration:none;
}
.cd4_search_art{
  display: initial;
    cursor: pointer;
    padding: 7px;
    border: 2px solid;
    border-left: 0;
    position: relative;
    top: 5px;
}
  .option_panel_elements {
    margin-bottom: 30px;
    padding: 0 50px;
}
#cd4_font-size_custm_design, .cd4_range_elem, .cd4_transparency {
    position: relative;
    top: -3px;
    width: 240px;
    background: #d3d3d3;
    height: 3px;
}
#cd4_font-size_custm_design_box, .cd4_range_elem_box, .cd4_transparency_box {
    width: 50px;
    float: right;
}
.cd4_button_custm_design {
    font-size: 20px;
    display: inline-block;
    width: 50px;
    text-align: center;
    background-color: #f1f1f1;
    padding: 5px;
  	cursor:pointer;
}
.action_panel:hover {
    background: #fff;
    color: #000;
    outline: 1px solid #dcdcdc;
}
#cd4_text-color {
    width: 55px;
    background-color: transparent;
    padding: 0;
    margin: 0;
    border: 0;
    height: 58px;
    position: relative;
    top: -4px;
    float: right;
}
.action_panel i.fa{
  	font-size: 30px;
    display: block;  	
}
img.cd4_tri_svg {
    width: 25px;
    display: block;
    margin: 0 auto 5px;
}
.action_panel {
    background-color: #f3f3f3;    
    padding: 8px;
  	cursor:pointer;
}
#cd4_inner_panel_shape .action_panel {
    margin: 0 8px;
}
.color_icon_bx {
    height: 29px;
    width: 29px;
    display: inline-block;
    border: 1px solid #dcdcdc;
    cursor: pointer;
}
.cd4_choosen_color {
    width: 70px;
    float: right;
}
#search_art_txt{
height: 54px !important;
    margin-left: -16px;
    width: 68%;
    padding: 10px;
    border-right: 0;
}
.action_panel.cd4_full_width.cd4_padding0 img {
    width: 100%;
}
.action_panel.cd4_full_width.cd4_padding0 {
    margin: 2px;
    font-size: 10px;
    text-transform: uppercase;
}
    @media only screen and (max-width: 1023px) {
      #cd4_sidebar_left{ display:none; }
      #main_options_mob{ display:block !important; }
      #custom_elem{
          float:left;
          width: calc(100% - 90px);
          min-height: calc(100vh - 200px);
          text-align: center;
      }
      #main_options_mob{
          background-color: #444;
      }
      .width_16{
          float:left;
          text-align: center;
          color: #fff;
          font-size: 10px;
          width: 20%;
          text-transform:uppercase;
          padding: 5px;
          outline: 1px solid #646464;
      }
      .width_16 img{
          max-width:40px;
          width:100%;
          padding-bottom: 11px;
      }
      .spl_change_p img{
          padding-bottom: 5px;
          width: 32px;
      }
      .img_main_options{
          height:50px;
          padding: 5px 7px 0;
      }
      .img_main_options_t{
          height:22px;
          padding: 0 7px 5px;
      }
      #cd4_inner_panel_mob_text h2{
        text-align:center;
      }
      #cd4_inner_panel_mob_text textarea{
        width:100%;
        height: 60px;
      }
    }
    @media only screen and (max-width: 460px) {
        #action_options{
            width:60px;
        }
        .action_panel2{
            padding: 7px 0;
        }
      .option_panel_elements{
        padding: 0 10px;
      }
    }
    @media only screen and (max-width: 440px) {
        /*#custom_elem img{
            max-width:245px;
        }
        #custom_elem .align_center {
            max-width: 245px;
            margin: 0 auto;
        } */
        .img_main_options_t{
        	height: 35px;
        }
    }
    @media only screen and (max-width: 430px) {
      	#custom_elem{
          width: 260px;
          min-height: 496px;
        }
    }

@media only screen and (max-width: 992px) {
  main { margin-top:0px; }
}

#cd4_art_category{
width: 85%;
}
input#search_art_txt{
width: 235px;
height: 35px !important;  
border: 1px solid;
margin-left: 0px;
}
#search_btn, #view_all {
font-size: 15px;
line-height: 0;
height: 35px;  
}






  .cd4_color_reset{
    display: inline-block;
    padding: 0 10px;
    border: 1px solid #000;
    position: relative;
    top: -10px;
  }
  .small_btn_plus_minus{
    width: 17px;
    position: relative;
    top: -10px;
    height: 28px;
    text-align: center;
    padding: 0;
  }
  .mob_img_filtr{
    display: inline-block;
    margin-right: 10px;
    padding: 5px;
    text-transform: uppercase;
    font-size: 10px;
    text-align: center;
  }
  .width_mob_px{
    display:inline-block;
    font-size: 10px;
    text-align: center;
    padding: 10px 9px;
  }
  #cd4_inner_panel_mob_text_option{
    background-color:#dcdcdc;
  }
  .text_options_icon{
    font-size: 32px;
    line-height: 35px;
    color: #666666;
  }
  .cd4_mob_header_options{
    font-size: 14px;
    background-color: #fff2e8;
    padding: 5px 0;
  }
  .cd4_mob_header_lft{
    text-align: left !important;
    padding-left: 10px;
  }
  .cd4_mob_header_rgt{
    text-align: right !important;
    padding-right: 10px;
  }
  .cd4_mob_own_color{
    height: 32px;
    width: 32px;
    position: relative;
    top: -4px;
  }
  #cd4_mobile_font_options{
    font-size: 14px;
  }
  #cd4_font-size_custm_design_m, #cd4_transparency_m, #cd4_transparency_m_1{
  	width: calc(100% - 60px);
    position: relative;
    top: -3px;
    background: #d3d3d3;
    height: 3px;
  }
  #cd4_font-size_custm_design_box_m, #cd4_transparency_box_m, #cd4_transparency_box_m_1{
    width: 40px;
  }
  .cd4_mob_tri_shape{
    font-size: 64px;
    position: relative;
    top: -14px;
    height: 40px;
  }
  #cd4_art_category_mob, #search_art_txt_mob, #search_btn_mob, #view_all_mob {
    height: 35px;
    border: 1px solid;
  }
  #cd4_inner_panel_art_mob {
    height: 400px;
    overflow-y: scroll;
    overflow-x: hidden;
    padding: 15px;
    border: 1px solid #dcdcdc;
    margin: 15px 0;
   }
   img.loading_icon {
        width: 50px;
        margin-top: 25px;
    }
    div#show_fnal_msg {
        text-align: center;
    }
  @media only screen and (max-width: 450px) {
    #cd4_art_category_mob {
      width: 100%;
      margin-bottom: 6px;
    }
  }






  .clearf{
    clear:both;
  }
  .cd4_svg_art_outer{
    border: 1px solid #9e9e9e;
    padding-top: 5px;
    margin: 0 3px;
    cursor: pointer;
  }
  #cd4_select_model{
    width: 100%;
    height: 40px;
  }
  
  #sub_options_mob_text{
    position: relative;
    top: -200px;
    background-color: #fbfbfb;
    padding: 20px;
  }
  .color_opt img {
    max-width:100%;
  }
  div#cd4_product_select_model, div#cd4_product_select_design {
    margin-top: 40px;
  }




.wood_type_icon{
  font-size: 80px !important;
}




  /* The Modal */
.option_element_25 {
  width: 25%;
  float: left;
  text-align: center;
}
.option_element_33 {
  width: 33.33%;
  float: left;
  text-align: center;
}
.modal_app {
  position: fixed; /* Stay in place */
  z-index: 1; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content {
  top: 20%;
  position: relative;
  background-color: #fefefe;
  margin: auto;
  padding: 0;
  border: 1px solid #888;
  width: 50%;
  box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2),0 6px 20px 0 rgba(0,0,0,0.19);
  -webkit-animation-name: animatetop;
  -webkit-animation-duration: 0.4s;
  animation-name: animatetop;
  animation-duration: 0.4s
}

/* Add Animation */
@-webkit-keyframes animatetop {
  from {top:-300px; opacity:0} 
  to {top:0; opacity:1}
}

@keyframes animatetop {
  from {top:-300px; opacity:0}
  to {top:0; opacity:1}
}

.modal-body {padding: 2px 16px;}

@media only screen and (max-width: 1000px) {
    .modal-content{
      width: 70%;
    }
}
@media only screen and (max-width: 600px) {
    .modal-content{
      width: 90%;
    }
}



.panel_txt {
    color: #fff;
}
.body .container {
    width: 100%;
    max-width: 98.5%;
}
.CategoryProductTop {
    display: none;
}
.option_panel .panel_txt {
    color: #000;
}