

    /* This CSS file is part of the HTML5 / CSS3 tutorial on http://www.lingulo.com */
    /* GLOBAL */
body {
    font-size:28px;
}

#fo input, #fo select, #fo textarea {
    font-size:80%;
    }

#fo .green input[type=submit], #footer .green .formsender { background: #01ABC5; }
#fo .blue input[type=submit], #footer .blue .formsender { background: #003366; }

#fo input[type="number"] { width:60px; }

#fo h1 { font-size:100%; }
#fo h2 { font-size: 95%; }
#fo h3 { font-size: 90%; }


    /****************** HEADER **********************************************/


#fo header h1 {
    font-size:150%;
}


#fo #boxcontent #ww4_list h2 {
    font-size:100%;
}



    /****************** DOCLIST **********************************************/
#fo #ww4_printFilter p {
    font-size: 80%;
}

#fo #ww4_printFilter div.summary, #fo #ww4_printFilter div.summary p {
    font-size: 80%;
}

#fo #pagewrap .listBlock .description p {
    font-size: 75%;
}

#fo .description p, #fo #ww4_printFilter .description p {
    font-size:80%;
}

#fo .borderedFrame h2, #fo .borderedFrameList h2 { font-size:64% !important; }

#fo #ww4_printFilter .borderedFrame p, #fo #ww4_printFilter .borderedFrame table, #fo #ww4_printFilter .borderedFrameList p, #fo #ww4_printFilter .borderedFrameList table {
    font-size:80%;
}

#fo #ww4_printFilter .borderedFrame ul li, #fo #ww4_printFilter .borderedFrameList ul li {
     font-size:80%;
 }

 #fo .buttons { clear: both; }

#fo .nextDoc, #fo .previousDoc {
    font-size: 70%;
}

 #fo .exerciseWrapper {
     font-size:80%;
 }

 #fo #ww4_printFilter .exerciseWrapper .exercise div.questionFile img {
    width: 80%;
 }

#fo .exerciseWrapper .exercise img.draggableImage { width: 50%; }

#fo #ww4_printFilter .exerciseWrapper .exercise .questionsContainer div p,
#fo #ww4_printFilter .exerciseWrapper .exercise .droppableContainer div p ,
#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer div p {
    font-size: 60%;
}

#fo #ww4_printFilter .exerciseWrapper .exercise .draggableContainer span.help {font-size: 80%;}


#fo .exerciseWrapper  textarea.userInput {
    font-size: 81%;
}

#fo .exerciseWrapper  input.userInput  {
    font-size: 63%;
}

#fo .inlineExercise .button {
     font-size: 54%;
 }

#fo .divascookies-accept-button-container > .divascookies-accept-button-text {
      font-size: 54%;
}
#fo h1.ww4 {
     font-size: 110%;
}
@media only screen and (min-width : 768px) and (max-width : 1024px) {
    #fo #horizontalMenu ul li a { font-size:50%;}
}



    /****************** READ-ALONGS **********************************************/
 #fo .page-wrapper .ra_container .ra_content {font-size: 72%;}

#fo #glossaryPopup {
    font-size: 70%;
}
#fo div.secondaryVersionButtonDiv .versionButton {
    font-size:63%;
}
@media (max-width: 1024px) {

    #fo .editor h1 { font-size: 30px; }

    #fo #ww4_printFilter article.editor h2 { font-size: 18px; }

    #fo input { padding:4px;font-size:80%;}

}

    /**********************	Mobile Layout: 765px (landscape) **********************/
@media (max-width: 765px) {

    body {
        font-size:20px;
    }
}

    /**********************	Mobile Layout: 525px **********************/
    /*@media (min-width: 500px) and (max-width: 525px) { } */

    /**********************	Mobile Layout: 500px (portrait) **********************/
@media (max-width: 500px) {
    body {
        font-size:18px;
    }
}

