/**
 * Advanced Lorem Ipsum Generator, Lipsum-UI created by Zainal Abidin Bobsaid
 * Date: 7 March 2012
 * URL: http://nextfunny.blogspot.com
 * Mottie: Thanks for all your help to realize this project :D
 * Note: This work is under a Creative Commons license (Attribution)(Non commercial)(No Derivate Works)
 *
 * PS: I don't like the JQuery UI themes which gives the curve angle with the same radius on all corners. It makes the proportion of the parent element and child elements of the widget to be not ideal.
 */



* {margin:0;padding:0;}

html {overflow-y:scroll;}

body {
  background:#F2F2F2 url(images/bg.png) no-repeat fixed top right;
  font:normal 11px Arial,Sans-Serif;
  color:#555;
}

form button, form input[type="button"], form input[type="submit"], form input[type="reset"] {
  padding:2px 5px;
  font:bold 10px Arial,Sans-Serif;
  margin:3px 0px;
}

p a.plus, p a.minus, li a.plus, li a.minus {
  color:#1C94C4;
  background:#fff;
  text-decoration:none;
  padding:0px 3px;
}

abbr {border-bottom:1px dotted #666;}

blockquote {
  background:#fff url(images/quote.jpg) no-repeat top left;
  padding:10px 10px 10px 50px;
  margin:10px 70px;
  font:bold 12px Georgia,Times,Serif;
}

pre {border:1px dashed #ddd;background:#eee;padding:10px;overflow:auto;margin:10px 30px;}

.separator {position:relative;}

.separator .image-option {
  position:absolute;
  bottom:14px;
  left:10px;
  padding:5px 10px;
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  border-radius:3px;
  display:none;
}

.separator.video .image-option {
  left:7px;
  bottom:7px;
}

.separator .image-option a.selected {text-decoration:none !important;}

#sidebar {
  width:350px;
  display:none;
}

#sidebar textarea {
  background:#fff;
  border:1px solid #ccc;
  padding:5px;
}

#sidebar button.choose {
  display:block;
  width:100%;
  margin:5px auto 5px;
}

#sidebar .imageBox {
  padding:5px 15px;
  background:#D0DCEC;
  border:1px solid #ADBCD3;
  margin-top:5px;
}

#sidebar .imageBox .inputs {
  padding:5px 5px;
  width:200px;
  margin-right:10px;
  border:1px solid #ccc;
  background:#fff;
  font:bold 11px Verdana,Arial,Sans-Serif;
}

#sidebar .panel button, .ui-dialog button {
  -webkit-border-radius:3px;
  -moz-border-radius:3px;
  border-radius:3px;
}

#mainButton {
  position:fixed !important;
  position:absolute;
  top:0px;
  left:0px;
  width:90%;
  z-index:1000;
  padding:15px 5%;
  cursor:move;
}

#mainButton .logo {
  position:absolute;
  top:7px;
  right:12px;
}

#mainButton .logo img {
  border:none;
  outline:none;
}

#preview {
  width:100%;
  height:100%;
  margin-bottom:100px;
}

#preview table {
  border-collapse:collapse;
}

#preview table td, #preview table th {
  border:1px solid #999;
  padding:10px 15px;
  background-color:#fff;
}

#preview table th {background-color:#eee;}

#preview ul, #preview ol {
  margin:0px 0px 0px 20px;
}

#area {
  width:720px;
  height:100%;
  margin:100px auto 100px;
}

textarea#pg {
  display:block;
  width:97%;
  height:200px;
  margin:10px 0px 10px 0px;
}

.sortable {
  padding:10px;
  margin:0px 0px 2px;
  position:relative;
  border:1px solid #ccc;
  background:#fff;
  cursor:move;
}

.sortable img {
  border:1px solid #e5e5e5;
  background:#eee;
  padding:2px;
}

.sortable input.remove {
  position:absolute;
  top:10px;
  left:10px;
  cursor:default;
  display:none;
}
.sortable:hover,
.sortable.active {background:#FFFF00;}
.sortable:hover input.remove,
.sortable.active input.remove {display:block;}

.sortable form {
  width:284px;
  margin:0px auto 0px;
  text-align:left;
  background:#ddd;
  border:2px solid #ccc;
  padding:15px;
}

.sortable form textarea {display:block;margin:5px 0px;}

.sortable form textarea, .sortable form input[type="text"], .sortable select {
  background:#fff;
  border:1px solid #bbb;
  font:bold 11px Arial,Sans-Serif;
  padding:5px;
  margin:5px 0px 0px;
  width:270px;
}

.sortable video {
  margin:0px auto 0px;
  background:#111;
  -webkit-box-shadow:0px 0px 10px rgba(0,0,0,0.4);
  -moz-box-shadow:0px 0px 10px rgba(0,0,0,0.4);
  box-shadow:0px 0px 10px rgba(0,0,0,0.4);
}

.footer {padding:10px 15px;margin:2px 0px;}

#preview li.remove {list-style:none;}

#preview tr.remove td {padding:5px 15px !important;}

#thecode {
  width:96% !important;
  border:none !important;
  height:auto;
  margin:0px 1px 0px 0px;
  resize:none;
  display:none;
}

#generate {}

.ui-dialog #thecode.ui-dialog-content {
  background:#222;
  color:#ccc;
  font-family:Monaco,'Courier MS',Monospace;
}

.ui-dialog .confirmbox.ui-dialog-content {
  color:#333;
  font:normal 11px Verdana,Arial,Sans-Serif;
}

.ui-dialog-content a {color:#1C94C4;}

.ui-accordion .ui-accordion-content {padding:5px 5px;}

.hidden {display:none;}

.clear {clear:both;}

@media screen and (max-width:1024px) {
	#area {
	  width:70%;
	  height:100%;
	  margin:100px auto 0px;
	}
}