/* Adjust foundation css to be smaller */
select.hp, label.hp, input.hp {
    margin: 0 !important;
}

.grid-padding-x > .cell {
    padding-left: 0.2rem;
    padding-right: 0.2rem;
}

.grid-padding-y > .cell {
    padding-top: 0.2rem;
    padding-bottom: 0;
}

.top-bar {
    padding: 0;
    border-bottom: 1px solid lightgray;
}
.top-bar ul {
    background-color: #2bb473 !important;
    color: white;
}
.top-bar ul a {
    transition: all 0.1s ease-in-out;
    font-weight: bold;
    color: white;
    text-decoration: underline;
}
.top-bar ul a:hover {
    background-color: white;
    color: black;
}

.callout {
    margin: 5px;
}

/* Golden layout scrollbar grab width. Without this it is very hard to scroll the content */
.lm_splitter.lm_vertical .lm_drag_handle {
    height: 5px;
    top: 0;
}
.lm_splitter.lm_horizontal .lm_drag_handle {
    width: 5px;
    left: 0;
 }
.lm_title {
     font-weight: bold;
 }

/**
 Minden elem megkapja az eredeti html-ben
*/
.hp-o, .hp-r {
  transition: all 200ms ease-in-out;
 }


/**
 Ha az element már benne van
**/
.hp-in-lesson-current {
    color: green;
    padding-left: 1em;
}
img.hp-in-lesson-current {
    border: 2px solid green;
    padding: 2px;
    margin-left: 1em;
}
.hp-in-lesson-other {
    opacity: 0.5;
    padding-left: 1em;
}

/**
  Eredeti
*/
.hp-o:hover {
  background-color: rgba(0, 0, 0, 0.05);
  cursor: pointer;
}

.hp-selected {
    background-color: rgba(0, 0, 0, 0.1);
}

.hp-blue {
    color: #14679e;
}
.hp-red {
    color: #cc4b37;
}
.hp-green {
    color: #22bb5b;
}
.hp-display-none {
    display: none;
}

#hp-notfound-folders {
    font-family: monospace;
}

#originalHtmlContent {
    font-size: x-small;
    line-height: 1.2em;
    margin: 5px;
}
#originalHtmlContent p {
    margin: 6px 0;
}

#originalCodeContent, #resultCodeContent {
    font-size: x-small;
}

#resultHtmlIframe {
    width: 100%;
    height: 100%;
    border: 0;
    overflow: auto;
}

#hp-innerhtml {
    width: 100%;
    height: 100%;
}

.button, .button-group {
    margin-bottom: 2px !important;
}