/**
         * Nestable Draggable Handles
         */

        .dd3-content { display: block; height: 30px; margin: 5px 0; padding: 5px 10px 5px 40px; color: #333; text-decoration: none; font-weight: bold; border: 1px solid #ccc;
            background: #fafafa;
            background: -webkit-linear-gradient(top, #fafafa 0%, #eee 100%);
            background:    -moz-linear-gradient(top, #fafafa 0%, #eee 100%);
            background:         linear-gradient(top, #fafafa 0%, #eee 100%);
            -webkit-border-radius: 3px;
                    border-radius: 3px;
            box-sizing: border-box; -moz-box-sizing: border-box;
        }
        .dd3-content:hover { color: #2ea8e5; background: #fff; }

        .dd-dragel > .dd3-item > .dd3-content { margin: 0; }

        .dd3-item > button { margin-left: 30px; }

        .dd3-handle { position: absolute; margin: 0; left: 0; top: 0; cursor: pointer; width: 30px; text-indent: 100%; white-space: nowrap; overflow: hidden;
            border: 1px solid #aaa;
            background: #ddd;
            background: -webkit-linear-gradient(top, #ddd 0%, #bbb 100%);
            background:    -moz-linear-gradient(top, #ddd 0%, #bbb 100%);
            background:         linear-gradient(top, #ddd 0%, #bbb 100%);
            border-top-right-radius: 0;
            border-bottom-right-radius: 0;
        }
        .dd3-handle:before { content: '≡'; display: block; position: absolute; left: 0; top: 3px; width: 100%; text-align: center; text-indent: 0; color: #fff; font-size: 20px; font-weight: normal; }
        .dd3-handle:hover { background: #ddd; }

        .pull-right {
            float: right;
        }

        .arrow-up {
            width: 0; 
            height: 0; 
            border-left: 12px solid transparent;
            border-right: 12px solid transparent;
            border-bottom: 12px solid black;
            cursor: pointer;
            margin-top: 2px;
        }

        .arrow-down {
            width: 0; 
            height: 0; 
            border-left: 12px solid transparent;
            border-right: 12px solid transparent;
            border-top: 12px solid black;
            cursor: pointer;
            margin-top: 2px;
        }

        .removeButton {
            cursor: pointer;
        }

        .dd3-content .arrow-down {
            margin-right: 5px;
        }

        .dd3-content .arrow-up {
            margin-right: 7px;
        }

        .inputField {
            padding: 0;
            width: 250px;
        }

        .myContent > li {
            padding: 8px 0 8px 0;
        }

        .myContent > li > ol > li{
            padding: 8px 0 8px 0;
        }
/* The todo items are grouped into an UL unordered list */

ul.todoList{
	margin:0 auto;
	width:500px;
	position:relative;
}

ul.todoList li{
	background-color:#F9F9F9;
	border:1px solid #EEEEEE;
	list-style:none;
	margin:6px;
	padding:6px 9px;
	position:relative;
	cursor:n-resize;

	/* CSS3 text shadow and rounded corners: */
	
	text-shadow:1px 1px 0 white;
	
	-moz-border-radius:6px;
	-webkit-border-radius:6px;
	border-radius:6px;
}

ul.todoList li:hover{
	border-color:#9be0f9;
	
	/* CSS3 glow effect: */
	-moz-box-shadow:0 0 5px #A6E5FD;
	-webkit-box-shadow:0 0 5px #A6E5FD;
	box-shadow:0 0 5px #A6E5FD;
}

.todo .text{
	color:#777777;
	font-size:1.4em;
}

/* The edit and delete buttons */
	
.todo .actions{
	position:absolute;
	right:7px;
	top:6px;
}

.todo .actions a{
	display:block;
	width:16px;
	height:16px;
	overflow:hidden;
	float:left;
	text-indent:-9999px;
	margin:3px;
}

.todo .actions a.edit{
	background:url("/img/edit.png") no-repeat center center;
}

.todo .actions a.delete{
	background:url("/img/delete.png") no-repeat center center;
}

/* The edit textbox */

.todo input{
	border:1px solid #CCCCCC;
	color:#666666;
	font-family:Arial,Helvetica,sans-serif;
	font-size:0.725em;
	padding:3px 4px;
	width:300px;
}

/* The Save and Cancel edit links: */

.editTodo{
	display:inline;
	font-size:0.6em;
	padding-left:9px;
}

.editTodo a{
	font-weight:bold;
}

a.discardChanges{
	color:#C00 !important;
}

a.saveChanges{
	color:#4DB209 !important;
}

/* Overwriting some of the default jQuery UI styles */

.ui-button,.ui-dialog-titlebar{
	font-size:0.72em !important;
}

#dialog-confirm{
	display:none;
	font-size:0.9em;
	padding:1em 1em 0;
}

#addButton{
	margin:20px auto;
}


/* Green button class: */

a.green-button,
a.green-button:visited {
	color:black;
	display:block;
	font-size:10px;
	font-weight:bold;
	height:15px;
	padding:6px 5px 4px;
	text-align:center;
	width:60px;
	
	text-shadow:1px 1px 1px #DDDDDD;
	background:url("/img/button_green.png") no-repeat left top;
}

a.green-button:hover{
	text-decoration:none;
	background-position:left bottom;
}

td.highlight {
    background-color: red;
    border: 1px blue solid;
}

.rotate {
    /* FF3.5+ */
    -moz-transform: rotate(-90.0deg);
    /* Opera 10.5 */
    -o-transform: rotate(-90.0deg);
    /* Saf3.1+, Chrome */
    -webkit-transform: rotate(-90.0deg);
    /* IE6,IE7 */
    filter: progid: DXImageTransform.Microsoft.BasicImage(rotation=0.083);
    /* IE8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0.083)";
    /* Standard */
    transform: rotate(-90.0deg);
}

@media (min-width: 768px) {
    .modal-xl {
      width: 95%;
     max-width:1800px;
    }
  }