/**
 * QuickQuiz v1.3.5
 * http://quizkquiz.ws
 * Copyright (c) 2015-present, Raquel García Cabañas
 */

@import url('import/icons.css');

html {
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAkAAAAJCAYAAADgkQYQAAAAL0lEQVQYV2P89u3bfy4uLkYGHAAkj1MSWQ9cEbqJyHzSTMLlJpA4aSZR7iZiwgkAsYQfzIbB/W8AAAAASUVORK5CYII=) repeat;
}

#quickquiz {
    font-family: 'Roboto', sans-serif;
    max-width: 750px;
    padding: 10px;
    margin: auto;
    margin-top: 1em;
    margin-bottom: 1em;
    overflow: hidden;
    background-size: cover;
}

/* you may use custom colors for your selected rating icons */
#quickquiz .rating .md-button.md-primary md-icon, #quickquiz table .md-button.md-primary md-icon {
    /* color:#eed700; */
}

/* YOU CAN CHANGE HERE THE COLOR FOR THE NAV BUTTONS */
#quickquiz .nav-buttons .md-button{
    /*color: #333;*/
    /*background-color: #80CBC4;*/
}

#quickquiz .nav-buttons .md-button:hover{
   /* background-color: #90DBD4;*/
}

/* input for 'other' option */
#quickquiz md-input-container.other-right {
    /* adjust the margin-left if you want the input to the right of the "other" option */
    margin-left: 70px;
    margin-top: -42px;
    width: 100%;
}
#quickquiz md-input-container.other-bottom {
    margin-top: -5px;
    width: 100%;
}
#quickquiz md-input-container.other-single {
    padding-left: 38px;
}
#quickquiz md-input-container.other-multiple {
    padding-left: 35px;
}

body {
    background-color: transparent;
}

#quickquiz > md-content {
    background-color: transparent;
}

#quickquiz .md-whiteframe-3dp {
    background-color: #ffffff;
	padding:0;
}

#quickquiz .item-separation {
    padding: 8px;
}

#quickquiz .title-toolbar {
    border-radius: 3px 3px 0 0;
    box-shadow: 0 1px rgba(255, 255, 255, 0.1);
}

#quickquiz h1 {
    margin-left: 24px;
}

#quickquiz .main-title.without-toolbar {
    padding-top: 30px;
}

#quickquiz .page {
    padding: 24px;
}

#quickquiz .prev-next, #quickquiz .pagNumber {
    padding: 0 24px;
}

#quickquiz .pagNumber {
    margin: 20px 0;
}

#quickquiz .quiz-container {
    margin-bottom: 1em;
    padding-bottom: 2em;
}

#quickquiz .md-display-1 {
    line-height: 30px;
    margin: 10px;
}

#quickquiz md-progress-linear {
    width: 100%;
}

#quickquiz .prev-next {
    margin-top: 2em;
    margin-bottom: 2em;
}



#quickquiz .question .md-button {
    width: 100%;
    padding: 5px;
    margin: 0;
    font-weight: normal;
    text-transform: none;
    min-width: 0;
}

#quickquiz .matrix-choices .md-button {
    padding: 5px 15px;
}

#quickquiz .question .md-button.no-border {
    padding: 0;
    min-height: 0;
    line-height: 0;
}

#quickquiz .md-char-counter {
    bottom: -15px;
    right: 2px;
    color: #999
}

#quickquiz .page ul {
    list-style-type: none;
    padding: 0;
}

#quickquiz .question {
    margin: 2em 0 3em 0;
}

#quickquiz .layout-answers {
    padding: 0;
}

#quickquiz .question-statement-line h3 {
    margin-top: 0;
}

#quickquiz .pointsPerQuestion {
    -webkit-flex-shrink: 0;
    -moz-flex-shrink: 0;
    -ms-flex-negative: 0;
    flex-shrink: 0;
}

#quickquiz .answer-container {
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
    overflow: hidden;
}

#quickquiz img {
    width: 100%;
    vertical-align: middle;
}

#quickquiz .aside-image {
    padding: 16px;
    cursor: pointer;
}

#quickquiz .aside-image-score img{
    padding: 16px;
    cursor: pointer;
    float: right;
    max-width: 25%;
}

#quickquiz .score-questions md-divider{
    clear: both;
}

#quickquiz .md-button.textLeft {
    text-align: left;
    padding-left: 15px;
}

#quickquiz .halfWidth {
    width: 50%;
}

#quickquiz .md-button.semitransparent, #quickquiz table.semitransparent {
    opacity: .9;
}

#quickquiz .matching-pairs .selected {
    background-color:#eee;
    color:#666666;

}

#quickquiz .matching-pairs .selected.border-color{
    border: 2px solid;
}


#quickquiz .matching-fixed.type-select {
    border-bottom: 1px solid rgba(0, 0, 0, 0.12);
    margin: 20px 25px 26px 0;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 3px;
    position: relative;
    box-sizing: border-box;
    min-width: 64px;
}

#quickquiz .matching-fixed.type-select span {
    display: inline-block;
    padding-top: 7px;
    padding-bottom: 2px;
}

#quickquiz .scale-text {
    margin-bottom: 1.5em;
}

#quickquiz .md-button.md-icon-button {
    width: auto;
}

#quickquiz .rating md-icon {
    width: 30px;
    height: 30px;
}

#quickquiz .rating .md-icon-button:hover,
#quickquiz .rating .md-icon-button:hover ~ .md-icon-button {
    opacity: .75;
    filter: alpha(opacity=75);
}

/* SCORE */

#quickquiz .score-message {
    text-align: center;
    margin: 20px 0;
}

#quickquiz .unanswered {
    font-style: italic;
}

#quickquiz .score-questions {
    margin-top: 2em;
}

#quickquiz .score-answers {
    margin: 0 0 2em 2em;
}

#quickquiz .score-answers .md-caption {
    margin-left: -1.5em;
    margin-top: 1.5em;
}

#quickquiz .score-questions img {
    width: 40%;
    margin-bottom: 1em;
    vertical-align: text-top;
    /*display: block;*/
    margin-right: 5px;
}

#quickquiz .score-questions .puzzle img {
    margin-bottom: 0;
}

/* FORM */

#quickquiz .form-container {
    margin-top: 30px;
}

#quickquiz .form-container form {
    margin-top: 20px;

}

/* MATRIX */

#quickquiz table, #quickquiz th , #quickquiz td {
    border: 1px solid grey;
    border-collapse: collapse;
    width: 100%;
}

#quickquiz th {
    background-color: #999;
    color: white;
    white-space: nowrap;
    padding: 15px;
}

#quickquiz table tr:nth-child(odd) {
    background-color: #f1f1f1;
    padding: 5px;
}

#quickquiz table tr:nth-child(even) {
    background-color: #ffffff;
}

#quickquiz table td {
    padding-left: 10px;
}

#quickquiz table td.radio {
    text-align: center;
    padding-left: 12px;
}

#quickquiz table .rating md-icon{
    margin: 5px 0 15px 0;
}


/* BASIC TEXT COLORS */

#quickquiz {
    color: #333; /* basic text color */
}

#quickquiz .pagNumber, #quickquiz .timer {
    color: #ccc;
}

#quickquiz .description, #quickquiz .pointsPerQuestion {
    color: #999;
}

#quickquiz [ng-message], #quickquiz .alert, md-input-container [ng-messages]{
    color: rgb(244,67,54);
    font-size: 12px !important;
    line-height: 14px;
    overflow: hidden;
    padding-top: 5px;
    opacity: 1 !important;
}

#quickquiz .alert.global{
    margin-top:20px;
}

/* VIDEOGULAR */

#quickquiz vg-overlay-play.audio {
    display: none;
}

#quickquiz videogular.hide-controls vg-controls, #quickquiz videogular.hide-controls vg-overlay-play {
    pointer-events: none;
    display: none;
}

#quickquiz videogular.hide-controls{
    pointer-events: none;
}

#quickquiz .videogular-container {
    width: 100%;
    margin: auto;
    overflow: hidden;
}

#quickquiz .videogular-container.video {
    height: 320px;
}

#quickquiz videogular.audio {
    height: 50px;
}

@media (min-width: 768px) {
    #quickquiz .videogular-container.video {
        height: 387px;
    }
}

#quickquiz vg-scrub-bar-cue-points .cue-point {
    width: 5px !important;
    height: 5px;
    border-radius: 50px;
}

#quickquiz videogular vg-scrub-bar [role=slider], [videogular] vg-scrub-bar [role=slider] {
    background-color: rgba(255, 255, 255, .2)
}

/* SENDING ICON */
#quickquiz .loading-icon {
    width: 100%;
    height: 100%;
    z-index: 10;
    top: 0;
    left: 0;
    position: fixed;
    background-color: rgba(0, 0, 0, 0.5);
}

#quickquiz .spinner {
    height: 40px;
    width: 40px;
    animation: rotate 0.8s infinite linear;
    border: 8px solid #333;
    border-right-color: transparent;
    border-radius: 50%;
}

@keyframes rotate {
    0%    { transform: rotate(0deg); }
    100%  { transform: rotate(360deg); }
}


/* table MySQL */

.tableMySQL {
    font-family: 'Roboto', sans-serif;
    font-size: .8em;
    margin: 15px;
}
.tableMySQL, .tableMySQL th , .tableMySQL td {
    border: 1px solid grey;
    border-collapse: collapse;
    padding: 15px;
    white-space: pre;

}
.tableMySQL th {
    background-color: #999;
    color: white;
}
.tableMySQL tr:nth-child(odd) {
    background-color: #f1f1f1;
}
.tableMySQL tr:nth-child(even) {
    background-color: #ffffff;
}

.tableText {
    font-family: 'Roboto', sans-serif;
    margin: 15px;
}

/*TRANSITION PAGES */

/* fade in-out */
*#quickquiz .fade.ng-enter {
    -webkit-transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.3s 0.3s;
    transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.3s 0.3s;
    opacity: 0;
    filter: alpha(opacity=0);
}

#quickquiz .fade.ng-enter.ng-enter-active {
    opacity: 1;
    filter: alpha(opacity=100);
}

#quickquiz .fade.ng-leave {
    -webkit-transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.2s;
    transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.2s;
    opacity: 1;
    filter: alpha(opacity=100);
}

#quickquiz .fade.ng-leave.ng-leave-active {
    opacity: 0;
    filter: alpha(opacity=0);
}

/* slide */

#quickquiz .slide.ng-enter {
    -webkit-transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.5s 0.3s;
    transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.5s 0.3s;
    -ms-transform: translateX(110%);
    -webkit-transform: translateX(110%);
    transform: translateX(110%);
    z-index: 9999;
}

#quickquiz .slide.ng-enter.ng-enter-active {
    -ms-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
    z-index: 9999;
}

#quickquiz .slide.ng-leave {
    -webkit-transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.2s;
    transition: all cubic-bezier(0.25, 0.50, 0.50, 0.90) 0.2s;
    -ms-transform: translateX(0);
    -webkit-transform: translateX(0);
    transform: translateX(0);
    z-index: 8888;
}

#quickquiz .slide.ng-leave.ng-leave-active {
    -ms-transform: translateX(-110%);
    -webkit-transform: translateX(-110%);
    transform: translateX(-110%);
    z-index: 8888;
}

/* END TRANSITION */

/** Social Button CSS **/

#quickquiz .qq_social_icons a{
    margin:0.7em;
    box-shadow: 3px 3px 3px 0 rgba(0,0,0,0.2);
}

#quickquiz .qq_social_icons a:hover {
    box-shadow: 3px 3px 3px 0 rgba(0, 0, 0, 0.4);
}

#quickquiz .qq_social_icons img{
    width: 50px;
    height: 50px;
}


/* media queries for mobile*/

@media (max-width: 600px) {
    #quickquiz {
        padding: 0;
        margin: 0;
    }

    #quickquiz .page{
        padding: 5px;
    }

    #quickquiz > .layout-padding {
        padding: 0;
    }

    #quickquiz .quiz-container {
        margin-bottom: 0;
    }

    #quickquiz .halfWidth {
        width: 100%;
    }

    #quickquiz .hide-image-mobile {
        display: none;
    }

    #quickquiz th {
        white-space: normal; /* delete or comment this line if your header text are too large */
        padding: 8px 3px;
    }

    #quickquiz table td {
        padding-left: 5px;
    }

    #quickquiz table td.radio {
        padding-left: 5px;
    }

    #quickquiz table .rating md-icon{
        margin: 0px 0 0px 0;
        padding:0;
    }

    #quickquiz .question table .md-button {
        padding:0 !important;
    }
}

@media screen and (min-width:0\0) {
    span[flex], .flex {
        display: block;
    }
}
@font-face{font-family:videogular;src:url(fonts/videogular.eot);src:url(fonts/videogular.eot?#iefix) format("embedded-opentype"),url(fonts/videogular.woff) format("woff"),url(fonts/videogular.ttf) format("truetype"),url(fonts/videogular.svg#videogular) format("svg");font-weight:400;font-style:normal}videogular,[videogular]{width:100%;height:100%;position:relative;background-color:#000;display:block;flex-direction:column;-webkit-touch-callout:none;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:moz-none;-ms-user-select:none;user-select:none}videogular button,[videogular] button{cursor:pointer}videogular.fullscreen,[videogular].fullscreen{position:fixed;left:0;top:0}videogular vg-media,[videogular] vg-media{width:100%;height:100%;max-width:100%;max-height:100%;display:block}videogular vg-media video,[videogular] vg-media video{width:100%;height:100%;max-width:100%;max-height:100%}videogular vg-media video::-webkit-media-text-track-container,[videogular] vg-media video::-webkit-media-text-track-container{bottom:50px}videogular .iconButton,[videogular] .iconButton{color:#FFF;font-family:videogular;speak:none;font-style:normal;font-weight:400;font-variant:normal;text-transform:none;line-height:1;-webkit-font-smoothing:antialiased;background:0 0;padding:6px;border:0}videogular .iconButton:focus,[videogular] .iconButton:focus{border:1px solid #fff}videogular vg-poster,[videogular] vg-poster{width:100%;height:100%;max-width:100%;max-height:100%;position:absolute;display:block;z-index:1;top:0;pointer-events:none}videogular vg-poster img,[videogular] vg-poster img{width:auto;height:auto;max-width:100%;max-height:100%;top:0;bottom:0;right:0;left:0;margin:auto;position:absolute}videogular vg-poster img.pause,videogular vg-poster img.play,[videogular] vg-poster img.pause,[videogular] vg-poster img.play{display:none}videogular vg-poster img.stop,[videogular] vg-poster img.stop{display:block}videogular vg-overlay-play,[videogular] vg-overlay-play{width:100%;height:100%;max-width:100%;max-height:100%;position:absolute;z-index:2;top:0}videogular vg-overlay-play .play:before,[videogular] vg-overlay-play .play:before{content:"\e000"}videogular vg-overlay-play .overlayPlayContainer,[videogular] vg-overlay-play .overlayPlayContainer{font-size:100px;width:100%;height:100%;max-width:100%;max-height:100%;position:absolute;display:table;cursor:pointer;zoom:1;filter:alpha(opacity=60);opacity:.6}videogular vg-overlay-play .overlayPlayContainer div,[videogular] vg-overlay-play .overlayPlayContainer div{vertical-align:middle;text-align:center;display:table-cell}videogular vg-controls,[videogular] vg-controls{width:100%;height:50px;display:block;position:absolute;z-index:3;top:calc(100% - 50px)}videogular vg-controls .controls-container,[videogular] vg-controls .controls-container{width:100%;height:50px;background-color:rgba(0,0,0,.5);position:absolute;display:table;zoom:1}videogular vg-play-pause-button,[videogular] vg-play-pause-button{display:table-cell;width:50px;vertical-align:middle;text-align:center;cursor:pointer}videogular vg-time-display,[videogular] vg-time-display{color:#FFF;display:table-cell;font-family:Arial;font-size:18px;width:75px;vertical-align:middle;text-align:center;cursor:default}videogular .vgTimeDisplay,[videogular] .vgTimeDisplay{display:table-cell;font-family:Arial;font-size:18px;width:auto}videogular vg-scrub-bar,[videogular] vg-scrub-bar{width:auto;display:table-cell;cursor:pointer;vertical-align:middle}videogular vg-scrub-bar [role=slider],[videogular] vg-scrub-bar [role=slider]{margin-top:24px;margin-bottom:24px;height:2px;background-color:#000}videogular vg-scrub-bar :focus vg-scrub-bar-current-time,[videogular] vg-scrub-bar :focus vg-scrub-bar-current-time{border-right:6px #000 groove}videogular vg-scrub-bar-current-time,[videogular] vg-scrub-bar-current-time{background-color:#FFF;width:100%;height:100%;display:block;cursor:pointer}videogular vg-scrub-bar-cue-points,[videogular] vg-scrub-bar-cue-points{width:100%;height:100%;display:block;position:relative}videogular vg-scrub-bar-cue-points .cue-point-timeline,[videogular] vg-scrub-bar-cue-points .cue-point-timeline{color:#FFF;padding-top:3px}videogular vg-scrub-bar-cue-points .cue-point-timeline .cue-point,[videogular] vg-scrub-bar-cue-points .cue-point-timeline .cue-point{position:absolute;height:3px;background-color:#FFF}videogular vg-playback-button,[videogular] vg-playback-button{display:table-cell;width:50px;vertical-align:middle;text-align:center;cursor:pointer}videogular vg-volume,[videogular] vg-volume{display:table-cell;width:50px;vertical-align:middle;text-align:center;cursor:pointer}videogular vg-volume-bar,[videogular] vg-volume-bar{width:50px;height:100px;top:-100px;margin-left:-25px;vertical-align:middle;text-align:center;position:absolute;cursor:pointer}@media screen and (-ms-high-contrast:active),(-ms-high-contrast:none){videogular vg-volume-bar,[videogular] vg-volume-bar{zoom:1;filter:alpha(opacity=50);opacity:.5}}videogular vg-fullscreen-button,[videogular] vg-fullscreen-button{display:table-cell;width:50px;vertical-align:middle;text-align:center;cursor:pointer}videogular vg-volume-bar .verticalVolumeBar,[videogular] vg-volume-bar .verticalVolumeBar{width:50px;height:100px;background-color:#000;position:absolute}videogular vg-volume-bar .volumeBackground,[videogular] vg-volume-bar .volumeBackground{width:20px;height:70px;left:15px;top:15px;background-color:#222;position:absolute}videogular vg-volume-bar .volumeValue,[videogular] vg-volume-bar .volumeValue{width:20px;height:100%;background-color:#FFF;position:absolute}videogular vg-volume-bar .volumeClickArea,[videogular] vg-volume-bar .volumeClickArea{width:20px;height:100%;position:absolute}videogular vg-controls .hide-animation,[videogular] vg-controls .hide-animation{animation:hideControlsAnimationFrames ease-out .5s;animation-iteration-count:1;animation-fill-mode:forwards;-webkit-animation:hideControlsAnimationFrames ease-out .5s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-moz-animation:hideControlsAnimationFrames ease-out .5s;-moz-animation-iteration-count:1;-moz-animation-fill-mode:forwards;-o-animation:hideControlsAnimationFrames ease-out .5s;-o-animation-iteration-count:1;-o-animation-fill-mode:forwards;-ms-animation:hideControlsAnimationFrames ease-out .5s;-ms-animation-iteration-count:1;-ms-animation-fill-mode:forwards}@keyframes hideControlsAnimationFrames{0%{opacity:.5}100%{opacity:0}}@-moz-keyframes hideControlsAnimationFrames{0%{opacity:.5}100%{opacity:0}}@-webkit-keyframes hideControlsAnimationFrames{0%{opacity:.5}100%{opacity:0}}@-o-keyframes hideControlsAnimationFrames{0%{opacity:.5}100%{opacity:0}}@-ms-keyframes hideControlsAnimationFrames{0%{opacity:.5}100%{opacity:0}}videogular vg-controls .show-animation,[videogular] vg-controls .show-animation{animation:showControlsAnimationFrames ease-out .5s;animation-iteration-count:1;animation-fill-mode:forwards;-webkit-animation:showControlsAnimationFrames ease-out .5s;-webkit-animation-iteration-count:1;-webkit-animation-fill-mode:forwards;-moz-animation:showControlsAnimationFrames ease-out .5s;-moz-animation-iteration-count:1;-moz-animation-fill-mode:forwards;-o-animation:showControlsAnimationFrames ease-out .5s;-o-animation-iteration-count:1;-o-animation-fill-mode:forwards;-ms-animation:showControlsAnimationFrames ease-out .5s;-ms-animation-iteration-count:1;-ms-animation-fill-mode:forwards}@keyframes showControlsAnimationFrames{0%{background-color:transparent}100%{background-color:rgba(0,0,0,.5)}}@-moz-keyframes showControlsAnimationFrames{0%{background-color:transparent}100%{background-color:rgba(0,0,0,.5)}}@-webkit-keyframes showControlsAnimationFrames{0%{background-color:transparent}100%{background-color:rgba(0,0,0,.5)}}@-o-keyframes showControlsAnimationFrames{0%{background-color:transparent}100%{background-color:rgba(0,0,0,.5)}}@-ms-keyframes showControlsAnimationFrames{0%{background-color:transparent}100%{background-color:rgba(0,0,0,.5)}}videogular vg-play-pause-button .play:before,[videogular] vg-play-pause-button .play:before{content:"\e000"}videogular vg-play-pause-button .pause:before,[videogular] vg-play-pause-button .pause:before{content:"\e001"}videogular vg-mute-button,[videogular] vg-mute-button{width:50px;display:block}videogular vg-mute-button .level3:before,[videogular] vg-mute-button .level3:before{content:"\e002"}videogular vg-mute-button .level2:before,[videogular] vg-mute-button .level2:before{content:"\e003"}videogular vg-mute-button .level1:before,[videogular] vg-mute-button .level1:before{content:"\e004"}videogular vg-mute-button .level0:before,[videogular] vg-mute-button .level0:before{content:"\e005"}videogular vg-mute-button .mute:before,[videogular] vg-mute-button .mute:before{content:"\e006"}videogular vg-fullscreen-button .enter:before,[videogular] vg-fullscreen-button .enter:before{content:"\e007"}videogular vg-fullscreen-button .exit:before,[videogular] vg-fullscreen-button .exit:before{content:"\e008"}videogular vg-buffering,[videogular] vg-buffering{width:100%;height:100%;position:absolute;z-index:4;top:0}videogular vg-buffering .bufferingContainer,[videogular] vg-buffering .bufferingContainer{width:100%;position:absolute;cursor:pointer;top:50%;margin-top:-50px;zoom:1;filter:alpha(opacity=60);opacity:.6}videogular vg-buffering .loadingSpinner,[videogular] vg-buffering .loadingSpinner{background-color:transparent;border:5px solid #fff;opacity:.9;border-top:5px solid transparent;border-left:5px solid transparent;border-radius:50px;box-shadow:0 0 35px #FFF;width:50px;height:50px;margin:0 auto;-moz-animation:spin .5s infinite linear;-webkit-animation:spin .5s infinite linear}videogular vg-buffering .loadingSpinner .stop,[videogular] vg-buffering .loadingSpinner .stop{-webkit-animation-play-state:paused;-moz-animation-play-state:paused}@-moz-keyframes spin{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(360deg)}}@-moz-keyframes spinoff{0%{-moz-transform:rotate(0deg)}100%{-moz-transform:rotate(-360deg)}}@-webkit-keyframes spin{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(360deg)}}@-webkit-keyframes spinoff{0%{-webkit-transform:rotate(0deg)}100%{-webkit-transform:rotate(-360deg)}}videogular vg-ima-ads,[videogular] vg-ima-ads{width:100%;height:100%;position:absolute;z-index:5;top:0;display:none}