/*tabs*/
#activity{
    margin-top: 2%;
}
#poem{
    margin: 1% 0 1% 3%
}
#tabs {
    display: none;
    width: 94%;
    margin: 0 3%;
    padding: 0px;
    background: none;
    border-width: 0px;
}
#tabs .ui-tabs-panel li {
    list-style-type: disc;
    display: inherit;
    margin-top:.5%;
}
.ui-tabs-panel {
    background-color: #309091;
    color: #fff;
    padding: 0 2%;
    margin: 0 0.5%;
    min-height: 12em;
    display: block;
    border-width: 0px 1px 1px 1px;
    border-top: 3.5em solid #F1EAD5;
/*    top: 3.5em;
    position: relative;
*/}
.ui-state-default {
    padding: 0 2%;
    width: 16%;
    height: 3.5em;
    background-color: #5BC8C1;
    color: #fff;
    text-decoration: none;
    float: left;
    /*text-align: center;*/
}
.ui-state-default a {
    text-decoration: none;
    color: #fff;
    height: 100%;
    display: block;
}
.ui-state-hover {
    background-color: #184549;
}
.ui-state-active {
    background-color: #309091;
}
.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited {
    color: #ffffff;
    text-decoration: none;
    height: 100%;
    width: 67%;
    display: block;
}


/* Corner radius */

.ui-corner-all, .ui-corner-top, .ui-corner-left, .ui-corner-tl {
    border-top-left-radius: 6px;
}
.ui-corner-all, .ui-corner-top, .ui-corner-right, .ui-corner-tr {
    border-top-right-radius: 6px;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-left, .ui-corner-bl {
    border-bottom-left-radius: 6px;
}
.ui-corner-all, .ui-corner-bottom, .ui-corner-right, .ui-corner-br {
    border-bottom-right-radius: 6px;
}
/*options*/

#options {
    width: 96%;
    margin: 1% 2%;
}
#options li {
    width: 19%;
    text-align: center;
}
/*feedbackHolder
*/
#feedbackHolder {
    padding: 1% 0;
    text-align: center;
}
/*input*/

input[type='radio'] {
    display: none;
}
input[type='radio'] + label {
    display: inline-block;
    width: 37px;
    height: 37px;
    cursor: pointer;
    vertical-align: middle;
    background: url(../../images/check_radio_button.png) left top no-repeat;
    float: left;
    position: absolute;
    margin: 0.5em;
    left: 0;
}
input[type='radio']:checked + label {
    background: url(../../images/check_radio_button.png) -42px top no-repeat;
}
/*feedback*/

.marking {
    min-height: 20px;
    min-width: 20px;
    position: relative;
    background-repeat: no-repeat;
    background-position: 97% 50%;
}
.correct {
    background-image: url(../../images/correct.png);
}
.incorrect {
    background-image: url(../../images/incorrect.png);
}
/*tabs*/

.ui-tabs {
    position: relative;
    /* position: relative prevents IE scroll bug (element with position: relative inside container with overflow: auto appear as "fixed") */
    
    padding: .2em;
}
.ui-tabs .ui-tabs-nav {
    padding-left: 0px;
    background: transparent;
    border-width: 0px 0px 1px 0px;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}
.ui-tabs .ui-tabs-nav li {
    list-style: none;
    float: left;
    position: relative;
    top: 0;
    margin: 0 0.5% 0 0.5%;
    border-bottom-width: 0;
    padding: 0;
    width: 19%;


}
.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
    float: left;
    margin-left: 2.6em;
    width: 66%;
    
    text-decoration: none;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active {
    margin-bottom: -1px;
    padding-bottom: 1px;
}
.ui-tabs .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-state-disabled .ui-tabs-anchor, .ui-tabs .ui-tabs-nav li.ui-tabs-loading .ui-tabs-anchor {
    cursor: text;
}
.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-active .ui-tabs-anchor {
    cursor: pointer;
}

@media only screen and (max-width: 1100px) {
.ui-tabs-anchor {
     font-size: 0.9em;
     padding-left: 0.81em;
}
}
@media only screen and (max-width: 1024px) {
    .ui-tabs-anchor {
        font-size: 0.8em;
        padding-top: 0.05em;

line-height: 1.15em;
vertical-align: middle;
-webkit-hyphens: manual;
-moz-hyphens: manual;


    }

}
@media only screen and (max-width: 885px) {
.ui-tabs-anchor {
     font-size: 0.7em;
     padding-left: 1em;
             padding-top: 1em;

}

@media only screen and (max-width: 768px) {
    .ui-tabs-anchor {
        font-size: 0.8em;
line-height: 1.15em;
padding-left: 1em;
padding-top: 0.05em;
width: 55% !important;
hyphens: manual;
-webkit-hyphens: manual;
-moz-hyphens: manual;

    }

}

