#mat-submission-modal-popup-container {
    min-height: auto;
}

.mat-submission-modal {
    padding: 1rem;
}
.mat-submission-modal .content {
    font-size: 1.1rem;
}
.mat-submission-modal .action {
    text-align: right;
}
.mobile-padding #rightcolumn [type='radio']:disabled{
        opacity: 0.5;
}
a.paintbox.hidden{
        display: none;
}
.mat-designer #rightcolumn [type='checkbox']:focus{box-shadow: none;}
.mat-designer #rightcolumn [type='checkbox']:checked {background-color: #296497;}
.mat-designer * { box-sizing: unset; }
body canvas.zoom, body.final canvas.zoom { position:fixed; z-index:102; top:50%; left:50%; 
    cursor: url('data:image/x-icon;base64,AAACAAEAICACAAYABgAwAQAAFgAAACgAAAAgAAAAQAAAAAEAAQAAAAAAgAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAA////AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA8AAAA/wAAAP8AAAH/gAABgYAAAYGAAAH/gAAA/wAAAP8AAAA8AAAAAAAAA///////////////////////////////////////////////////////////////////////////////////////9////+P////H////j///wx///wA///4Af//+AH///AA///wAP//8AD///AA///4Af//+AH///wD////D///8='), auto; 
}
.fulloverlay { position:fixed; top:0; left:0; width:100%; height:100%; z-index:101; background-color: rgba(0,0,0,0.5); }
#container { position:relative; width:970px; margin:16px auto 0; }
#message { position:absolute; top:0; left:0; width:970px; height:594px; background-color:rgba(255,255,255,0.7); /*filter: alpha(opacity=80); opacity:0.8;*/ z-index:100;  }
#messagebox { margin: 0 auto; width: 300px; padding:20px; background-color:#FFF; box-shadow: 0 0 15px #000; margin-top:200px;  }
#messagebox h1 { margin-top:0; }
#messagebox a.button { display:block; text-align:center; margin:0 auto; margin-top:2em; background-color:#002a5c; border-style:none; color:#cbd4de; text-decoration:none; font-size:14px; padding:10px; }
#messagebox a.button:hover { color: #FFF; }


input.color { border:2px solid #BBB; padding:2px; width:50px; }

.athleticgold { background-color: #F9D700; border-color:#F9D700; color:#6e5f00; }
.royalblue { background-color: #1B3D8B; border-color:#1B3D8B; color:#c3d7fe; }
.black { background-color: #000000; border-color:#000; color: #C7C7C7; line-height:20px; }
.brightred { background-color: #FF2600; border-color:#FF2600; color:#7b1200; }
.scarlettred { background-color: #D81D00; border-color:#D81D00; color:#490900; }
.navyblue { background-color: #21283C; border-color:#21283C; color:#b9c5e6; }
.lightmaroon { background-color: #84221f; border-color:#84221f; color:#f0bfbc; }
.darkmaroon { background-color: #591b19; border-color:#591b19; color:#e8c1be; }
.kellygreen { background-color: #00CB00; border-color:#00CB00; color:#004900; }
.green { background-color: #1D3E10; border-color:#1D3E10; color:#92c77b; line-height:20px; }
.orange { background-color: #ff9a00; border-color:#ff9a00; color:#6a4102; line-height:20px; }
.purple { background-color: #583570; border-color:#583570; color: #d1a6ee; line-height:20px; }
.lightgray { background-color: #dbdbdb; border-color:#dbdbdb; color:#4e4e4e; }
.yellow { background-color: #FFFA00; border-color:#FFFA00; color:#646200; }
.vegas { background-color: #DFD576; border-color:#DFD576; color:#65602a; }
.manilla { background-color: #f8e4b0; border-color:#f8e4b0; color:#645b45; line-height:20px; }
.lightblue { background-color: #00c1ff; border-color:#00c1ff; color:#00455b; }
.darkgray { background-color: #8c8c8c; border-color:#8c8c8c; color:#FFF; }
.white { background-color: #FFFFFF; border-color:#BBB; color:#000; line-height:20px; }
.brown { background-color: #8B4028; border-color:#8B4028; color:#e4c6bc; line-height:20px; }
.lighter { background-color: #666666; border-color:#666666; color:#FFF; }
.darker { background-color: #000000; border-color:#000; color:#FFF; }
.none { border-color:#BBB; line-height:20px; }

/* Updated paint colors, overriding existing values */


.lightgray { background-color:#b3b3b3; border-color:#b3b3b3; }
.gold { background-color:#fcba28; border-color:#fcba28;  color:#6e5f00; line-height:20px; }
.lightblue { background-color:#1e80d0; border-color:#1e80d0; color:#bfdff4; }
.darkgray { background-color:#6d7370; border-color:#6d7370; }
.red { background-color:#a40000; border-color:#a40000; color:#e9bfbf; line-height:20px; }
.yellow { background-color:#fbdd2e; border-color:#fbdd2e; line-height:20px; }
.kellygreen { background-color:#216421; border-color:#216421; color:#c7d8c6; }
.purple { background-color:#444069; border-color:#444069; }
.maroon { background-color:#632534; border-color:#632534; color:#e8c1be; line-height:20px;  }
.forestgreen { background-color:#154724; border-color:#154724; color:#c4d1c8; }
.navyblue { background-color:#192b48; border-color:#192b48; }
.orange { background-color:#e25120; border-color:#e25120; color:#f8d3c3; }
.royalblue { background-color:#0a2473; border-color:#0a2473; }
.vegas { background-color:#ddb63e; border-color:#ddb63e; }
.vegasb { background-color:#9f7d23; border-color:#9f7d23; color:#e2dcc8;}


#matcolors a { font-size: 11px; line-height:20px; }

#matcolors a.royalblue { background-color:#0047C1; border-color:#0047C1; }
#matcolors a.gold { background-color:#ffc000; border-color:#ffc000; color:#7b5d00; }
#matcolors a.gray { background-color:#BDBDBD; border-color:#BDBDBD; color:#000; }
#matcolors a.green { background-color:#024933; border-color:#024933; }
#matcolors a.maroon { background-color:#802f4d; border-color:#802f4d; color:#f0bfbc; }
#matcolors a.navyblue { background-color:#013666; border-color:#013666; }
#matcolors a.purple { background-color:#56409a; border-color:#56409a; }
#matcolors a.red { background-color:#f63336; border-color:#f63336; color:#ffdddc; }
#matcolors a:hover { border-color:#111; }

#drawing, #rightcolumn { display:inline-block; vertical-align:top; }
#rightcolumn { margin-left:10px; }
#properties { width:443px; height:560px; background-color:#fbfbfb; border:1px solid #9e9e9e; position:relative; overflow:hidden; /*white-space:nowrap;*/ }
#properties > div > div { position: relative; height:558px; width:443px; float:left; }

#nav { font-size: 21px; text-transform: uppercase; margin-bottom:4px; white-space:nowrap;  }
#nav a { color: #DBDBDB; text-decoration: none; }
#nav a:hover { color: #AAA; }
#nav a.active { color: #b70000; }
.navarrow { margin:0 16px; vertical-align:top; }


.buttonbar { position: absolute; bottom: 0; left: 0; width:100%; height:57px; border-top:1px solid #9e9e9e; }
.buttonbar a { display:block; background-color:#002a5c; border-style:none; color: #cbd4de; text-decoration:none; min-width:90px; font-size:14px; position:absolute; top:11px; height:27px; border-radius:3px; }
.buttonbar a.right {line-height: 16px;right:10px; padding: 10px 50px 0px 16px; background: #296497 url('https://assets.incstores.com/components/wrestlingMatDesigner/assets/navarrows.png') no-repeat right top;color: #EAF0F5; }
.buttonbar a.right.red { color:#f1cccc; background-color:#b70000; }
.buttonbar a.right.green { color:#D8F3D4; background-color:#348526; }
.buttonbar a.right.green:hover{background-color: #023020;}
.buttonbar a.center { left: 50%; font-size:10px; border:1px solid #DDD; min-width:56px; background: #F6F6F6 url('https://assets.incstores.com/components/wrestlingMatDesigner/assets/zoom.png') no-repeat 8px center; color:#999; padding: 6px 8px 6px 0; text-align:right !important; height:23px; width:56px; margin-left:-33px; line-height:24px; }
.buttonbar a.left {line-height: 16px;left:10px; padding: 10px 16px 0px 50px; text-align:right; background: #002a5c url('https://assets.incstores.com/components/wrestlingMatDesigner/assets/navarrows.png') no-repeat left top; }
.buttonbar a.right:hover { background-color: #15324C; background-position: right bottom; }
.buttonbar a.center:hover { border-color:#AAA; }
.buttonbar a.left:hover { color: #FFF; background-position: left bottom; }
#circletypes .switcher { background-color: #E9E9E9; margin-bottom:5px; padding: 8px 3px 8px 11px; width:170px; cursor:pointer;font-size: 14px;}
#circletypes .switcher:hover { background-color: #CCC; }
#circletypes .switcher label { font-size:14px; }
#circletypes .switcher.active { border-left: 3px solid #002a5c; width:181px; padding-left:8px; height:84px; background: #E9E9E9 url('https://assets.incstores.com/components/wrestlingMatDesigner/assets/switcher.png') no-repeat right top; }
.switcher .circlethumb { height:62px; width:62px; margin-top: 5px; display:none; background: url('https://assets.incstores.com/components/wrestlingMatDesigner/assets/circles.png') no-repeat left top; }
.switcher.active .circlethumb { display:inherit; }

#properties h1 { font-size:18px; color: #296497; font-weight:600; margin-top:1em; }
#properties label { font-size: 15px; color: #252525; }
span.sublabel { font-size: 12px; color: #181818; }
#properties label.disabled { color: #999; }
#practicecolor.disabled { cursor:default; }
.padding { padding: 15px; }
.disabled { color: #AAA; }
.mat-designer #rightcolumn div#navfinished{background-color:#ebf0f6!important;color: #296497!important;font-weight: 600}
#proplettering .textnote {font-size: 14px;}
div#proplogos .logonote{font-size: 14px;}
#propfinish label { font-size:12px; width: 100px; display:inline; text-align: right; margin-right: 5px; font-weight: 400; display: inline-block; }
#propfinish label.error { margin: 0 0 0 8px; color: #D7301A; font-size: 11px; width:auto;  }
#propfinish input { width: 162px; font-size:14px; padding:4px;height: 20px; }
#propfinish p { clear:both; padding-bottom: 0; margin: 0.5em 0;display: flex; }

#fontlist, #logolist { background-color:#F0F0F0; position:absolute; width:100%; border:1px solid #AAA; margin-left:-1px; font-size:15px; }
#fontselect, #logoselect { padding:8px; width:100%; position:relative; cursor:pointer; }
#fontselect.selected, #logoselect.selected { border-color:#AAA; }
#fontmenu, #logomenu { background-color: #F0F0F0; border:1px solid #999; position:relative; width:400px; background: #F0F0F0 url('https://assets.incstores.com/components/wrestlingMatDesigner/assets/downarrow.png') no-repeat right center; margin-bottom:1em; }
#fontmenu:hover, #logomenu:hover { border-color: #333; }
#fontlist a { text-decoration:none; color:#0077c0; display:block; margin-bottom:8px; }
#logolist a.selected img { margin:0; border:1px solid #000; padding:2px; }
#logolist a { display: inline-block; font-size:11px; text-align: center; color: #FFF; text-decoration: none; }
#logolist a img { margin:1px; border-width:0; width:64px; height:64px; }

a.paintbox { display:block; border-width: 2px; border-style:solid; float:left; margin: 0 3px 3px 0; padding:3px 5px 0 5px; font-size:8px; width: 35px; height: 22px; text-align:center; text-decoration:none; }
a.paintbox.selected, #matcolors a.paintbox.selected, a.paintbox:hover { border-color:#000; }
#matcolors a.paintbox { width:64px; }
input.color.selected { border-color: #000; }
input#lettering { border:1px solid #444; }
input#lettering:disabled { color: #CCC; border-color:#c4c4c4; }

.muli { font-family: 'Muli', sans-serif; }
.robotocondensed { font-family: 'Roboto Condensed', sans-serif; font-weight: bold; }
.quantico { font-family: 'Quantico', sans-serif; }
.arial { font-family: 'Arial', Gadget, sans-serif; font-weight:bold; }
.helvetica { font-family: 'Helvetica Bold', sans-serif; }
.times { font-family: "Times New Roman", Times, serif; font-weight: bold; }
.timesnewroman { font-family: "Times New Roman", Times, serif; font-weight:bold; }
.impact { font-family: Impact, Charcoal, sans-serif; }

.princetown { 
    font-family: PrincetownSHOP-Regular;
    font-weight: normal;
    font-style: normal;
}
.machine { 
    font-family: Machine;
    font-weight: normal;
    font-style: normal;
}
.rockwell { 
    font-family: RockwellStd-Bold;
    font-weight: normal;
    font-style: normal;
}
.yearbook {
    font-family: YearbookSolid;
    font-weight: normal;
    font-style: normal;
}

.mat-designer #rightcolumn #nav .navarrow{
    display: none;
}
.mat-designer #rightcolumn #nav{
    margin-bottom: 0;
}
.mat-designer #rightcolumn #nav a{
    color:#252525;
    font-size: 18px;
    padding: 0 15px;
}
.mat-designer #rightcolumn #nav a.active{
    color: #296497;
    border-bottom: 4px solid #296497;
}
.mat-designer #rightcolumn [type='radio']:focus {
    box-shadow: none;
}
.mat-designer #rightcolumn [type='radio']:checked{
    background-color: #296497;
}
.mobile-padding.mat-designer {
    margin: 50px 0;
}
.hotspot { background-color:#000; }
#logohotspots div, #texthotspots div { opacity: 0.25; cursor:pointer; position:absolute; width:50px; height:50px; background-color:#FFF; border-radius: 25px; }
#logohotspots.clear div, #texthotspots.clear div { opacity: 0.0; }
#logohotspots div.selected, #texthotspots div.selected { background-color:#FF0000; opacity: 0.35; }
.overlay { display: none; }
#logohotspots.selected, #texthotspots.selected, #matloading.selected { display: block; }
#textclearbutton, #textrotatebutton, #logoclearbutton, #logorotatebutton, #logodeselect, #textdeselect { display:inline-block; background-color:#296497; color:#EAF0F5; padding:10px; text-decoration:none; }
#textclearbutton:hover, #textrotatebutton:hover, #logoclearbutton:hover, #logorotatebutton:hover, #logodeselect:hover, #textdeselect:hover { background-color:#15324C }
#textclearbutton.disabled, #textrotatebutton.disabled, #logoclearbutton.disabled, #logorotatebutton.disabled, #logodeselect.disabled, #textdeselect.disabled { color:#DDD; cursor:default; background-color:#AAA; }
#currentlogo img { width:64px; height:64px; }
#propview { display:none; }
body.viewmode #propview { display:block; }
body.viewmode #propsize { display:none; }
form#aspnetForm select {font-size: 14px;height: 20px;line-height: 20px;}
form#aspnetForm div#popup {display: none;}
@media all and (max-width: 1000px) {
    #rightcolumn { display:block; transform-origin: top left; }
    #logobox { display:none; }
    #rightcolumn { margin-top:1em; }
}

@media all and (max-width: 500px) {
    #rightcolumn { transform: scale(.90); }
	.circulardesignertool-index-index .columns{
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
.mobile-padding.mat-designer {
    margin: 25px 0 30px;
}
}
#properties h1{margin-top: 0.5em;}
#propfinish label{width: 95px}
textarea#comments{height: 55px!important;}
}

@media all and (max-width: 450px) {
    #rightcolumn { transform: scale(.85); }
}


@media all and (max-width: 425px) {
    #rightcolumn { transform: scale(.75); }
}

@media all and (max-width: 380px) {
    #rightcolumn { transform: scale(.65); }
}

@media print
{
    div#header, #rightcolumn, #logohotspots, #texthotspots { display:none; }
    canvas#a { display: block; }
}