/* TCI Editor
*  v2.3.2
*  Dev Team: Om, Prerana & Chandan
*  Support: omtonk@gmail.com */

.tciEditor { position:relative; width:100%; display:inline-block; border:1px solid rgba(0,0,0,.2); overflow:hidden; box-sizing:border-box;}
.tciEditor * { box-sizing:border-box; outline:none;}
.tciEditorContainer { width:100%; position:relative; background:#f1f1f1; box-shadow:0 2px 2px -1px rgba(0, 0, 0, 0.1); overflow:auto; float:left; resize:vertical;}
.tciEditorContainer > iframe { width:100%; height:calc(100% - 15px); background:#fff;}
.tciEditorTool { width:100%; display:inline-block; float:left; position:relative; background:#f8f8f8; border-bottom:1px solid rgba(0,0,0,.2); box-shadow:0 2px 2px -1px rgba(0, 0, 0, 0.1);}
.tciEditorBtn { display:inline-block; float:left; height:32px; padding:6px; color:#333;}
.tciEditorBtn:before { content:""; width:10000px; height:1px; display:inline-block; background:#eee; position:absolute; left:-50%; bottom:100%;}
.tciEditorBtn:hover { background:#fff;}
.tciEditorBtn.active { background:#eee;}
.tciEditorBtn span.material-icons { font-size:20px; line-height:20px; float:left; cursor:pointer;}
.tciEditorBtn.small { height:21px; padding:4px;}
.tciEditorBtn.small i { font-size:13px; line-height:13px;}
.tciEditorBtn.medium { height:32px; padding:6px;}
.tciEditorBtn.medium i { font-size:20px; line-height:20px;}
.tciEditorBtn.large { height:40px; padding:8px;}
.tciEditorBtn.large i { font-size:24px; line-height:24px;}
.tciEditorDropDownBox { display:inline-block; background:#fff; padding:4px; box-shadow:0 8px 10px 1px rgba(0,0,0,0.14), 0 3px 14px 2px rgba(0,0,0,0.12), 0 5px 5px -3px rgba(0,0,0,0.2); position:absolute; top:100%; left:0; cursor:default; max-height:204px; overflow-y:auto;}
.tciTooltip { width:280px; display:inline-block; padding:8px; font-size:13px;}
.tciTooltipTitle { font:600 13px Arial, Helvetica, sans-serif; margin-bottom:8px;}
.tciTooltipInputBox { width:100%; display:inline-block;}
.tciTooltipInput { width:100%; padding:8px; margin-bottom:5px; background:#fcfcfc; color:#666; border:1px solid #ddd; border-radius:3px; font-size:13px;}
.tciTooltipInput:hover { border:1px solid #bbb; box-shadow:0 0 5px 0 rgba(75,75,75,.1) inset;}
.tciTooltipInput:focus { border:1px solid #7ebff1; box-shadow:0 0 4px 0 #96c8d9;}
.widthHalf { width:48%; margin-right:2%; display:inline-block; float:left;}
.width100 { width:100px; display:inline-block;}
.tciTooltipError { font:13px Arial, Helvetica, sans-serif; color:#e00;}
.linkTarget { position:relative;}
.linkTarget label { padding:8px 8px 8px 20px; position:relative; top:-2px; left:-17px; z-index:1;}
.tciTooltipButton { display:inline-block; font:600 12px Arial, Helvetica, sans-serif; color:#757575; padding:7px 13px; margin-top:10px; border:1px solid #bcbbcd; border-bottom:1px solid #79788b; border-radius:3px; text-shadow:0 1px #f1f1f4; background:#d9d9e2; background:linear-gradient(to top,#d9d9e2 0%,#fafafb 100%); box-shadow:0 1px 2px rgba(0,0,0,.2); cursor:pointer;}
.tciTooltipButton:active { background:linear-gradient(to top, #cbcbd3 0%, #e8e8e9 100%); color:#333;}
.tciTooltipButton:hover { border:1px solid #6591ee; border-bottom:1px solid #1c46a4; box-shadow:0 0 4px 0 #96c8d9;}
.dropdownMenu { width:120px; display:inline-block;}
.dropdownMenu .tciTooltipTitle { padding-top:8px; padding-left:8px;}
.dropdownMenu ul { display:inline-block; width:100%;}
.dropdownMenu li { position:relative; display:inline-block; width:100%;}
.dropdownMenu li label { display:block; width:100%; height:100%; padding-left:8px;}
.dropdownMenu li input { display:inline-block; width:100%; height:100%; margin:0; position:absolute; left:0; top:0; opacity:0; z-index:1; cursor:pointer;}
.dropdownMenu li:hover label { background:rgba(0,0,0,.05);}
.dropdownMenu li input[checked='checked'] + label { background:rgba(0,0,0,.1);}
.tciColorBox { display:inline-block; width:320px; float:left;}
.colorBoxHalf { display:inline-block; width:144px; float:left; margin:0 8px 2px 8px;}
.tciColorTitle { font:14px Arial, Helvetica, sans-serif; margin:8px 0;}
.colorPlate { width:100%; display:inline-block; margin-bottom:6px; float:left;}
.colorPlate li { position:relative; display:inline-block; width:18px; height:18px; float:left;}
.colorPlate li label.color { display:block; width:100%; height:100%; border:1px solid #fff;}
.colorPlate li input { display:inline-block; width:100%; height:100%; margin:0; position:absolute; left:0; top:0; opacity:0; z-index:1; cursor:pointer;}
.colorPlate li input[checked='checked'] + label.color, .colorPlate li:hover label.color { border:1px solid #000;}
.colorPlate li input[checked='checked'] + label.color:after { content:"✓"; display:inline-block; width:90%; height:100%; position:absolute; top:0; left:0; font-size:12px; line-height:18px; text-shadow:1px 0px 1px #333; color:#fff; text-align:center;}
.SourceCode { width:100%; height:calc(100% - 15px) !important; padding:8px !important; font-size:14px; line-height:normal; position:absolute; left:0; top:0; border:none; border-top:none; background:#fff; box-shadow:none; resize:none; background:#f6f7f8; color:#7d2727; font-family:Consolas, Menlo, Monaco, "Lucida Console", "Liberation Mono", "DejaVu Sans Mono", "Bitstream Vera Sans Mono", "Courier New", monospace, sans-serif;}