UNPKG

qompile

Version:

Compile HTML plus dynamic styles and convert to HTML and CSS

38 lines (32 loc) • 40.1 kB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
<!DOCTYPE html><html><head><meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title>Qompile Test</title> <style> /* Widget Base Styles */ .widget, .widget * { box-sizing: border-box; font-family: sans-serif; } .widget { margin: 1em 0; padding: 1em; color: white; background: black; } </style> <style>@media(min-width:121px) and (max-width:151px){[data-widgetel100eloffsetWidtheloffsetWidth200at121="0"].widget{background:red}}@media(min-width:151px) and (max-width:181px){[data-widgetel100eloffsetWidtheloffsetWidth200at151="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at151="1"].widget{background:red}}@media(min-width:181px) and (max-width:211px){[data-widgetel100eloffsetWidtheloffsetWidth200at181="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at181="1"].widget{background:red}}@media(min-width:211px) and (max-width:241px){[data-widgetel100eloffsetWidtheloffsetWidth200at211="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at211="1"].widget{background:red}}@media(min-width:241px) and (max-width:271px){[data-widgetel100eloffsetWidtheloffsetWidth200at241="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at241="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at241="0"].widget{background:orange}}@media(min-width:271px) and (max-width:301px){[data-widgetel100eloffsetWidtheloffsetWidth200at271="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at271="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at271="0"].widget{background:orange}}@media(min-width:301px) and (max-width:331px){[data-widgetel100eloffsetWidtheloffsetWidth200at301="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at301="0"].widget,[data-widgetel200eloffsetWidtheloffsetWidth300at301="1"].widget{background:orange}}@media(min-width:331px) and (max-width:361px){[data-widgetel100eloffsetWidtheloffsetWidth200at331="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at331="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at331="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at331="0"].widget{background:#ff0}}@media(min-width:361px) and (max-width:391px){[data-widgetel100eloffsetWidtheloffsetWidth200at361="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at361="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at361="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at361="0"].widget{background:#ff0}}@media(min-width:391px) and (max-width:421px){[data-widgetel100eloffsetWidtheloffsetWidth200at391="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at391="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at391="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at391="0"].widget{background:#ff0}}@media(min-width:421px) and (max-width:451px){[data-widgetel100eloffsetWidtheloffsetWidth200at421="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at421="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at421="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at421="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at421="0"].widget{background:lime}}@media(min-width:451px) and (max-width:481px){[data-widgetel100eloffsetWidtheloffsetWidth200at451="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at451="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at451="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at451="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at451="0"].widget{background:lime}}@media(min-width:481px) and (max-width:511px){[data-widgetel100eloffsetWidtheloffsetWidth200at481="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at481="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at481="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at481="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at481="0"].widget{background:lime}}@media(min-width:511px) and (max-width:541px){[data-widgetel100eloffsetWidtheloffsetWidth200at511="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at511="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at511="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at511="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at511="0"].widget{background:lime}}@media(min-width:541px) and (max-width:571px){[data-widgetel100eloffsetWidtheloffsetWidth200at541="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at541="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at541="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at541="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at541="0"].widget{background:blue}}@media(min-width:571px) and (max-width:601px){[data-widgetel100eloffsetWidtheloffsetWidth200at571="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at571="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at571="0"].widget{background:orange}[data-widgetel400eloffsetWidtheloffsetWidth500at571="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at571="0"].widget{background:blue}}@media(min-width:601px) and (max-width:631px){[data-widgetel100eloffsetWidtheloffsetWidth200at601="0"].widget,[data-widgetel100eloffsetWidtheloffsetWidth200at601="1"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at601="0"].widget{background:orange}[data-widgetel400eloffsetWidtheloffsetWidth500at601="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at601="0"].widget{background:blue}}@media(min-width:631px) and (max-width:661px){[data-widgetel100eloffsetWidtheloffsetWidth200at631="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at631="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at631="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at631="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at631="0"].widget{background:indigo}}@media(min-width:661px) and (max-width:691px){[data-widgetel100eloffsetWidtheloffsetWidth200at661="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at661="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at661="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at661="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at661="0"].widget{background:indigo}}@media(min-width:691px) and (max-width:721px){[data-widgetel100eloffsetWidtheloffsetWidth200at691="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at691="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at691="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at691="0"].widget{background:blue}[data-widgetel600eloffsetWidtheloffsetWidth700at691="0"].widget{background:indigo}}@media(min-width:721px) and (max-width:751px){[data-widgetel100eloffsetWidtheloffsetWidth200at721="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at721="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at721="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at721="0"].widget{background:blue}[data-widgetel700eloffsetWidthat721="0"].widget{background:purple}}@media(min-width:751px) and (max-width:781px){[data-widgetel100eloffsetWidtheloffsetWidth200at751="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at751="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at751="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at751="0"].widget{background:blue}[data-widgetel700eloffsetWidthat751="0"].widget{background:purple}}@media(min-width:781px) and (max-width:811px){[data-widgetel100eloffsetWidtheloffsetWidth200at781="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at781="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at781="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at781="0"].widget{background:blue}[data-widgetel700eloffsetWidthat781="0"].widget{background:purple}}@media(min-width:811px) and (max-width:841px){[data-widgetel100eloffsetWidtheloffsetWidth200at811="0"].widget{background:red}[data-widgetel200eloffsetWidtheloffsetWidth300at811="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at811="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at811="0"].widget{background:blue}[data-widgetel700eloffsetWidthat811="0"].widget{background:purple}}@media(min-width:841px) and (max-width:871px){[data-widgetel200eloffsetWidtheloffsetWidth300at841="0"].widget,[data-widgetel200eloffsetWidtheloffsetWidth300at841="1"].widget{background:orange}[data-widgetel400eloffsetWidtheloffsetWidth500at841="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at841="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat841="0"].widget{background:purple}}@media(min-width:871px) and (max-width:901px){[data-widgetel200eloffsetWidtheloffsetWidth300at871="0"].widget,[data-widgetel200eloffsetWidtheloffsetWidth300at871="1"].widget{background:orange}[data-widgetel400eloffsetWidtheloffsetWidth500at871="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at871="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat871="0"].widget{background:purple}}@media(min-width:901px) and (max-width:931px){[data-widgetel200eloffsetWidtheloffsetWidth300at901="0"].widget,[data-widgetel200eloffsetWidtheloffsetWidth300at901="1"].widget{background:orange}[data-widgetel400eloffsetWidtheloffsetWidth500at901="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at901="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat901="0"].widget{background:purple}}@media(min-width:931px) and (max-width:961px){[data-widgetel200eloffsetWidtheloffsetWidth300at931="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at931="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at931="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at931="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat931="0"].widget{background:purple}}@media(min-width:961px) and (max-width:991px){[data-widgetel200eloffsetWidtheloffsetWidth300at961="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at961="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at961="0"].widget{background:lime}[data-widgetel700eloffsetWidthat961="0"].widget,[data-widgetel700eloffsetWidthat961="1"].widget{background:purple}}@media(min-width:991px) and (max-width:1021px){[data-widgetel200eloffsetWidtheloffsetWidth300at991="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at991="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at991="0"].widget{background:lime}[data-widgetel700eloffsetWidthat991="0"].widget,[data-widgetel700eloffsetWidthat991="1"].widget{background:purple}}@media(min-width:1021px) and (max-width:1051px){[data-widgetel200eloffsetWidtheloffsetWidth300at1021="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at1021="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1021="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1021="0"].widget,[data-widgetel700eloffsetWidthat1021="1"].widget{background:purple}}@media(min-width:1051px) and (max-width:1081px){[data-widgetel200eloffsetWidtheloffsetWidth300at1051="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at1051="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1051="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1051="0"].widget,[data-widgetel700eloffsetWidthat1051="1"].widget{background:purple}}@media(min-width:1081px) and (max-width:1111px){[data-widgetel200eloffsetWidtheloffsetWidth300at1081="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at1081="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1081="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1081="0"].widget,[data-widgetel700eloffsetWidthat1081="1"].widget{background:purple}}@media(min-width:1111px) and (max-width:1141px){[data-widgetel200eloffsetWidtheloffsetWidth300at1111="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at1111="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1111="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1111="0"].widget,[data-widgetel700eloffsetWidthat1111="1"].widget{background:purple}}@media(min-width:1141px) and (max-width:1171px){[data-widgetel200eloffsetWidtheloffsetWidth300at1141="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at1141="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1141="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1141="0"].widget,[data-widgetel700eloffsetWidthat1141="1"].widget{background:purple}}@media(min-width:1171px) and (max-width:1201px){[data-widgetel200eloffsetWidtheloffsetWidth300at1171="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at1171="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1171="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1171="0"].widget,[data-widgetel700eloffsetWidthat1171="1"].widget{background:purple}}@media(min-width:1201px) and (max-width:1231px){[data-widgetel200eloffsetWidtheloffsetWidth300at1201="0"].widget{background:orange}[data-widgetel300eloffsetWidtheloffsetWidth400at1201="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1201="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1201="0"].widget,[data-widgetel700eloffsetWidthat1201="1"].widget{background:purple}}@media(min-width:1231px) and (max-width:1261px){[data-widgetel300eloffsetWidtheloffsetWidth400at1231="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1231="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1231="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1231="0"].widget,[data-widgetel700eloffsetWidthat1231="1"].widget{background:purple}}@media(min-width:1261px) and (max-width:1291px){[data-widgetel300eloffsetWidtheloffsetWidth400at1261="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1261="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1261="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1261="0"].widget,[data-widgetel700eloffsetWidthat1261="1"].widget{background:purple}}@media(min-width:1291px) and (max-width:1321px){[data-widgetel300eloffsetWidtheloffsetWidth400at1291="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1291="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1291="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1291="0"].widget,[data-widgetel700eloffsetWidthat1291="1"].widget{background:purple}}@media(min-width:1321px) and (max-width:1351px){[data-widgetel300eloffsetWidtheloffsetWidth400at1321="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1321="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1321="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1321="0"].widget,[data-widgetel700eloffsetWidthat1321="1"].widget{background:purple}}@media(min-width:1351px) and (max-width:1381px){[data-widgetel300eloffsetWidtheloffsetWidth400at1351="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1351="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1351="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1351="0"].widget,[data-widgetel700eloffsetWidthat1351="1"].widget{background:purple}}@media(min-width:1381px) and (max-width:1411px){[data-widgetel300eloffsetWidtheloffsetWidth400at1381="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1381="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1381="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1381="0"].widget,[data-widgetel700eloffsetWidthat1381="1"].widget{background:purple}}@media(min-width:1411px) and (max-width:1441px){[data-widgetel300eloffsetWidtheloffsetWidth400at1411="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1411="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1411="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1411="0"].widget,[data-widgetel700eloffsetWidthat1411="1"].widget{background:purple}}@media(min-width:1441px) and (max-width:1471px){[data-widgetel300eloffsetWidtheloffsetWidth400at1441="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1441="0"].widget{background:lime}[data-widgetel700eloffsetWidthat1441="0"].widget,[data-widgetel700eloffsetWidthat1441="1"].widget,[data-widgetel700eloffsetWidthat1441="2"].widget{background:purple}}@media(min-width:1471px) and (max-width:1501px){[data-widgetel300eloffsetWidtheloffsetWidth400at1471="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1471="0"].widget{background:lime}[data-widgetel700eloffsetWidthat1471="0"].widget,[data-widgetel700eloffsetWidthat1471="1"].widget,[data-widgetel700eloffsetWidthat1471="2"].widget{background:purple}}@media(min-width:1501px) and (max-width:1531px){[data-widgetel300eloffsetWidtheloffsetWidth400at1501="0"].widget{background:#ff0}[data-widgetel400eloffsetWidtheloffsetWidth500at1501="0"].widget{background:lime}[data-widgetel700eloffsetWidthat1501="0"].widget,[data-widgetel700eloffsetWidthat1501="1"].widget,[data-widgetel700eloffsetWidthat1501="2"].widget{background:purple}}@media(min-width:1531px) and (max-width:1561px){[data-widgetel300eloffsetWidtheloffsetWidth400at1531="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1531="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1531="0"].widget,[data-widgetel700eloffsetWidthat1531="1"].widget,[data-widgetel700eloffsetWidthat1531="2"].widget{background:purple}}@media(min-width:1561px) and (max-width:1591px){[data-widgetel300eloffsetWidtheloffsetWidth400at1561="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1561="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1561="0"].widget,[data-widgetel700eloffsetWidthat1561="1"].widget,[data-widgetel700eloffsetWidthat1561="2"].widget{background:purple}}@media(min-width:1591px) and (max-width:1621px){[data-widgetel300eloffsetWidtheloffsetWidth400at1591="0"].widget{background:#ff0}[data-widgetel500eloffsetWidtheloffsetWidth600at1591="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1591="0"].widget,[data-widgetel700eloffsetWidthat1591="1"].widget,[data-widgetel700eloffsetWidthat1591="2"].widget{background:purple}}@media(min-width:1621px) and (max-width:1651px){[data-widgetel400eloffsetWidtheloffsetWidth500at1621="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at1621="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1621="0"].widget,[data-widgetel700eloffsetWidthat1621="1"].widget,[data-widgetel700eloffsetWidthat1621="2"].widget{background:purple}}@media(min-width:1651px) and (max-width:1681px){[data-widgetel400eloffsetWidtheloffsetWidth500at1651="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at1651="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1651="0"].widget,[data-widgetel700eloffsetWidthat1651="1"].widget,[data-widgetel700eloffsetWidthat1651="2"].widget{background:purple}}@media(min-width:1681px) and (max-width:1711px){[data-widgetel400eloffsetWidtheloffsetWidth500at1681="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at1681="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1681="0"].widget,[data-widgetel700eloffsetWidthat1681="1"].widget,[data-widgetel700eloffsetWidthat1681="2"].widget{background:purple}}@media(min-width:1711px) and (max-width:1741px){[data-widgetel400eloffsetWidtheloffsetWidth500at1711="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at1711="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1711="0"].widget,[data-widgetel700eloffsetWidthat1711="1"].widget,[data-widgetel700eloffsetWidthat1711="2"].widget{background:purple}}@media(min-width:1741px) and (max-width:1771px){[data-widgetel400eloffsetWidtheloffsetWidth500at1741="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at1741="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1741="0"].widget,[data-widgetel700eloffsetWidthat1741="1"].widget,[data-widgetel700eloffsetWidthat1741="2"].widget{background:purple}}@media(min-width:1771px) and (max-width:1801px){[data-widgetel400eloffsetWidtheloffsetWidth500at1771="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at1771="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1771="0"].widget,[data-widgetel700eloffsetWidthat1771="1"].widget,[data-widgetel700eloffsetWidthat1771="2"].widget{background:purple}}@media(min-width:1801px) and (max-width:1831px){[data-widgetel400eloffsetWidtheloffsetWidth500at1801="0"].widget{background:lime}[data-widgetel500eloffsetWidtheloffsetWidth600at1801="0"].widget{background:blue}[data-widgetel700eloffsetWidthat1801="0"].widget,[data-widgetel700eloffsetWidthat1801="1"].widget,[data-widgetel700eloffsetWidthat1801="2"].widget{background:purple}}@media(min-width:1831px) and (max-width:1861px){[data-widgetel400eloffsetWidtheloffsetWidth500at1831="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1831="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1831="0"].widget,[data-widgetel700eloffsetWidthat1831="1"].widget,[data-widgetel700eloffsetWidthat1831="2"].widget{background:purple}}@media(min-width:1861px) and (max-width:1891px){[data-widgetel400eloffsetWidtheloffsetWidth500at1861="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1861="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1861="0"].widget,[data-widgetel700eloffsetWidthat1861="1"].widget,[data-widgetel700eloffsetWidthat1861="2"].widget{background:purple}}@media(min-width:1891px) and (max-width:1921px){[data-widgetel400eloffsetWidtheloffsetWidth500at1891="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1891="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1891="0"].widget,[data-widgetel700eloffsetWidthat1891="1"].widget,[data-widgetel700eloffsetWidthat1891="2"].widget{background:purple}}@media(min-width:1921px) and (max-width:1951px){[data-widgetel400eloffsetWidtheloffsetWidth500at1921="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1921="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1921="0"].widget,[data-widgetel700eloffsetWidthat1921="1"].widget,[data-widgetel700eloffsetWidthat1921="2"].widget{background:purple}}@media(min-width:1951px) and (max-width:1981px){[data-widgetel400eloffsetWidtheloffsetWidth500at1951="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1951="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1951="0"].widget,[data-widgetel700eloffsetWidthat1951="1"].widget,[data-widgetel700eloffsetWidthat1951="2"].widget{background:purple}}@media(min-width:1981px) and (max-width:2000px){[data-widgetel400eloffsetWidtheloffsetWidth500at1981="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at1981="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat1981="0"].widget,[data-widgetel700eloffsetWidthat1981="1"].widget,[data-widgetel700eloffsetWidthat1981="2"].widget{background:purple}}@media(min-width:2000px){[data-widgetel400eloffsetWidtheloffsetWidth500at2000="0"].widget{background:lime}[data-widgetel600eloffsetWidtheloffsetWidth700at2000="0"].widget{background:indigo}[data-widgetel700eloffsetWidthat2000="0"].widget,[data-widgetel700eloffsetWidthat2000="1"].widget,[data-widgetel700eloffsetWidthat2000="2"].widget{background:purple}}</style></head><body><div class="widget" data-widgetel100eloffsetwidtheloffsetwidth200at121="0" data-widgetel100eloffsetwidtheloffsetwidth200at151="0" data-widgetel100eloffsetwidtheloffsetwidth200at181="0" data-widgetel100eloffsetwidtheloffsetwidth200at211="0" data-widgetel200eloffsetwidtheloffsetwidth300at241="0" data-widgetel200eloffsetwidtheloffsetwidth300at271="0" data-widgetel200eloffsetwidtheloffsetwidth300at301="0" data-widgetel300eloffsetwidtheloffsetwidth400at331="0" data-widgetel300eloffsetwidtheloffsetwidth400at361="0" data-widgetel300eloffsetwidtheloffsetwidth400at391="0" data-widgetel400eloffsetwidtheloffsetwidth500at421="0" data-widgetel400eloffsetwidtheloffsetwidth500at451="0" data-widgetel400eloffsetwidtheloffsetwidth500at481="0" data-widgetel400eloffsetwidtheloffsetwidth500at511="0" data-widgetel500eloffsetwidtheloffsetwidth600at541="0" data-widgetel500eloffsetwidtheloffsetwidth600at571="0" data-widgetel500eloffsetwidtheloffsetwidth600at601="0" data-widgetel600eloffsetwidtheloffsetwidth700at631="0" data-widgetel600eloffsetwidtheloffsetwidth700at661="0" data-widgetel600eloffsetwidtheloffsetwidth700at691="0" data-widgetel700eloffsetwidthat721="0" data-widgetel700eloffsetwidthat751="0" data-widgetel700eloffsetwidthat781="0" data-widgetel700eloffsetwidthat811="0" data-widgetel700eloffsetwidthat841="0" data-widgetel700eloffsetwidthat871="0" data-widgetel700eloffsetwidthat901="0" data-widgetel700eloffsetwidthat931="0" data-widgetel700eloffsetwidthat961="0" data-widgetel700eloffsetwidthat991="0" data-widgetel700eloffsetwidthat1021="0" data-widgetel700eloffsetwidthat1051="0" data-widgetel700eloffsetwidthat1081="0" data-widgetel700eloffsetwidthat1111="0" data-widgetel700eloffsetwidthat1141="0" data-widgetel700eloffsetwidthat1171="0" data-widgetel700eloffsetwidthat1201="0" data-widgetel700eloffsetwidthat1231="0" data-widgetel700eloffsetwidthat1261="0" data-widgetel700eloffsetwidthat1291="0" data-widgetel700eloffsetwidthat1321="0" data-widgetel700eloffsetwidthat1351="0" data-widgetel700eloffsetwidthat1381="0" data-widgetel700eloffsetwidthat1411="0" data-widgetel700eloffsetwidthat1441="0" data-widgetel700eloffsetwidthat1471="0" data-widgetel700eloffsetwidthat1501="0" data-widgetel700eloffsetwidthat1531="0" data-widgetel700eloffsetwidthat1561="0" data-widgetel700eloffsetwidthat1591="0" data-widgetel700eloffsetwidthat1621="0" data-widgetel700eloffsetwidthat1651="0" data-widgetel700eloffsetwidthat1681="0" data-widgetel700eloffsetwidthat1711="0" data-widgetel700eloffsetwidthat1741="0" data-widgetel700eloffsetwidthat1771="0" data-widgetel700eloffsetwidthat1801="0" data-widgetel700eloffsetwidthat1831="0" data-widgetel700eloffsetwidthat1861="0" data-widgetel700eloffsetwidthat1891="0" data-widgetel700eloffsetwidthat1921="0" data-widgetel700eloffsetwidthat1951="0" data-widgetel700eloffsetwidthat1981="0" data-widgetel700eloffsetwidthat2000="0"> <p>Qompile Demo</p> </div> <div class="widget" style="width:75%" data-widgetel100eloffsetwidtheloffsetwidth200at151="1" data-widgetel100eloffsetwidtheloffsetwidth200at181="1" data-widgetel100eloffsetwidtheloffsetwidth200at211="1" data-widgetel100eloffsetwidtheloffsetwidth200at241="0" data-widgetel100eloffsetwidtheloffsetwidth200at271="0" data-widgetel200eloffsetwidtheloffsetwidth300at301="1" data-widgetel200eloffsetwidtheloffsetwidth300at331="0" data-widgetel200eloffsetwidtheloffsetwidth300at361="0" data-widgetel200eloffsetwidtheloffsetwidth300at391="0" data-widgetel300eloffsetwidtheloffsetwidth400at421="0" data-widgetel300eloffsetwidtheloffsetwidth400at451="0" data-widgetel300eloffsetwidtheloffsetwidth400at481="0" data-widgetel300eloffsetwidtheloffsetwidth400at511="0" data-widgetel300eloffsetwidtheloffsetwidth400at541="0" data-widgetel400eloffsetwidtheloffsetwidth500at571="0" data-widgetel400eloffsetwidtheloffsetwidth500at601="0" data-widgetel400eloffsetwidtheloffsetwidth500at631="0" data-widgetel400eloffsetwidtheloffsetwidth500at661="0" data-widgetel500eloffsetwidtheloffsetwidth600at691="0" data-widgetel500eloffsetwidtheloffsetwidth600at721="0" data-widgetel500eloffsetwidtheloffsetwidth600at751="0" data-widgetel500eloffsetwidtheloffsetwidth600at781="0" data-widgetel500eloffsetwidtheloffsetwidth600at811="0" data-widgetel600eloffsetwidtheloffsetwidth700at841="0" data-widgetel600eloffsetwidtheloffsetwidth700at871="0" data-widgetel600eloffsetwidtheloffsetwidth700at901="0" data-widgetel600eloffsetwidtheloffsetwidth700at931="0" data-widgetel700eloffsetwidthat961="1" data-widgetel700eloffsetwidthat991="1" data-widgetel700eloffsetwidthat1021="1" data-widgetel700eloffsetwidthat1051="1" data-widgetel700eloffsetwidthat1081="1" data-widgetel700eloffsetwidthat1111="1" data-widgetel700eloffsetwidthat1141="1" data-widgetel700eloffsetwidthat1171="1" data-widgetel700eloffsetwidthat1201="1" data-widgetel700eloffsetwidthat1231="1" data-widgetel700eloffsetwidthat1261="1" data-widgetel700eloffsetwidthat1291="1" data-widgetel700eloffsetwidthat1321="1" data-widgetel700eloffsetwidthat1351="1" data-widgetel700eloffsetwidthat1381="1" data-widgetel700eloffsetwidthat1411="1" data-widgetel700eloffsetwidthat1441="1" data-widgetel700eloffsetwidthat1471="1" data-widgetel700eloffsetwidthat1501="1" data-widgetel700eloffsetwidthat1531="1" data-widgetel700eloffsetwidthat1561="1" data-widgetel700eloffsetwidthat1591="1" data-widgetel700eloffsetwidthat1621="1" data-widgetel700eloffsetwidthat1651="1" data-widgetel700eloffsetwidthat1681="1" data-widgetel700eloffsetwidthat1711="1" data-widgetel700eloffsetwidthat1741="1" data-widgetel700eloffsetwidthat1771="1" data-widgetel700eloffsetwidthat1801="1" data-widgetel700eloffsetwidthat1831="1" data-widgetel700eloffsetwidthat1861="1" data-widgetel700eloffsetwidthat1891="1" data-widgetel700eloffsetwidthat1921="1" data-widgetel700eloffsetwidthat1951="1" data-widgetel700eloffsetwidthat1981="1" data-widgetel700eloffsetwidthat2000="1"> <p>Qompile Demo</p> </div> <div class="widget" style="width:50%" data-widgetel100eloffsetwidtheloffsetwidth200at241="1" data-widgetel100eloffsetwidtheloffsetwidth200at271="1" data-widgetel100eloffsetwidtheloffsetwidth200at301="0" data-widgetel100eloffsetwidtheloffsetwidth200at331="0" data-widgetel100eloffsetwidtheloffsetwidth200at361="0" data-widgetel100eloffsetwidtheloffsetwidth200at391="0" data-widgetel200eloffsetwidtheloffsetwidth300at421="0" data-widgetel200eloffsetwidtheloffsetwidth300at451="0" data-widgetel200eloffsetwidtheloffsetwidth300at481="0" data-widgetel200eloffsetwidtheloffsetwidth300at511="0" data-widgetel200eloffsetwidtheloffsetwidth300at541="0" data-widgetel200eloffsetwidtheloffsetwidth300at571="0" data-widgetel200eloffsetwidtheloffsetwidth300at601="0" data-widgetel300eloffsetwidtheloffsetwidth400at631="0" data-widgetel300eloffsetwidtheloffsetwidth400at661="0" data-widgetel300eloffsetwidtheloffsetwidth400at691="0" data-widgetel300eloffsetwidtheloffsetwidth400at721="0" data-widgetel300eloffsetwidtheloffsetwidth400at751="0" data-widgetel300eloffsetwidtheloffsetwidth400at781="0" data-widgetel300eloffsetwidtheloffsetwidth400at811="0" data-widgetel400eloffsetwidtheloffsetwidth500at841="0" data-widgetel400eloffsetwidtheloffsetwidth500at871="0" data-widgetel400eloffsetwidtheloffsetwidth500at901="0" data-widgetel400eloffsetwidtheloffsetwidth500at931="0" data-widgetel400eloffsetwidtheloffsetwidth500at961="0" data-widgetel400eloffsetwidtheloffsetwidth500at991="0" data-widgetel500eloffsetwidtheloffsetwidth600at1021="0" data-widgetel500eloffsetwidtheloffsetwidth600at1051="0" data-widgetel500eloffsetwidtheloffsetwidth600at1081="0" data-widgetel500eloffsetwidtheloffsetwidth600at1111="0" data-widgetel500eloffsetwidtheloffsetwidth600at1141="0" data-widgetel500eloffsetwidtheloffsetwidth600at1171="0" data-widgetel500eloffsetwidtheloffsetwidth600at1201="0" data-widgetel600eloffsetwidtheloffsetwidth700at1231="0" data-widgetel600eloffsetwidtheloffsetwidth700at1261="0" data-widgetel600eloffsetwidtheloffsetwidth700at1291="0" data-widgetel600eloffsetwidtheloffsetwidth700at1321="0" data-widgetel600eloffsetwidtheloffsetwidth700at1351="0" data-widgetel600eloffsetwidtheloffsetwidth700at1381="0" data-widgetel600eloffsetwidtheloffsetwidth700at1411="0" data-widgetel700eloffsetwidthat1441="2" data-widgetel700eloffsetwidthat1471="2" data-widgetel700eloffsetwidthat1501="2" data-widgetel700eloffsetwidthat1531="2" data-widgetel700eloffsetwidthat1561="2" data-widgetel700eloffsetwidthat1591="2" data-widgetel700eloffsetwidthat1621="2" data-widgetel700eloffsetwidthat1651="2" data-widgetel700eloffsetwidthat1681="2" data-widgetel700eloffsetwidthat1711="2" data-widgetel700eloffsetwidthat1741="2" data-widgetel700eloffsetwidthat1771="2" data-widgetel700eloffsetwidthat1801="2" data-widgetel700eloffsetwidthat1831="2" data-widgetel700eloffsetwidthat1861="2" data-widgetel700eloffsetwidthat1891="2" data-widgetel700eloffsetwidthat1921="2" data-widgetel700eloffsetwidthat1951="2" data-widgetel700eloffsetwidthat1981="2" data-widgetel700eloffsetwidthat2000="2"> <p>Qompile Demo</p> </div> <div class="widget" style="width:33.33%" data-widgetel100eloffsetwidtheloffsetwidth200at331="1" data-widgetel100eloffsetwidtheloffsetwidth200at361="1" data-widgetel100eloffsetwidtheloffsetwidth200at391="1" data-widgetel100eloffsetwidtheloffsetwidth200at421="0" data-widgetel100eloffsetwidtheloffsetwidth200at451="0" data-widgetel100eloffsetwidtheloffsetwidth200at481="0" data-widgetel100eloffsetwidtheloffsetwidth200at511="0" data-widgetel100eloffsetwidtheloffsetwidth200at541="0" data-widgetel100eloffsetwidtheloffsetwidth200at571="0" data-widgetel100eloffsetwidtheloffsetwidth200at601="0" data-widgetel200eloffsetwidtheloffsetwidth300at631="0" data-widgetel200eloffsetwidtheloffsetwidth300at661="0" data-widgetel200eloffsetwidtheloffsetwidth300at691="0" data-widgetel200eloffsetwidtheloffsetwidth300at721="0" data-widgetel200eloffsetwidtheloffsetwidth300at751="0" data-widgetel200eloffsetwidtheloffsetwidth300at781="0" data-widgetel200eloffsetwidtheloffsetwidth300at811="0" data-widgetel200eloffsetwidtheloffsetwidth300at841="0" data-widgetel200eloffsetwidtheloffsetwidth300at871="0" data-widgetel200eloffsetwidtheloffsetwidth300at901="0" data-widgetel300eloffsetwidtheloffsetwidth400at931="0" data-widgetel300eloffsetwidtheloffsetwidth400at961="0" data-widgetel300eloffsetwidtheloffsetwidth400at991="0" data-widgetel300eloffsetwidtheloffsetwidth400at1021="0" data-widgetel300eloffsetwidtheloffsetwidth400at1051="0" data-widgetel300eloffsetwidtheloffsetwidth400at1081="0" data-widgetel300eloffsetwidtheloffsetwidth400at1111="0" data-widgetel300eloffsetwidtheloffsetwidth400at1141="0" data-widgetel300eloffsetwidtheloffsetwidth400at1171="0" data-widgetel300eloffsetwidtheloffsetwidth400at1201="0" data-widgetel400eloffsetwidtheloffsetwidth500at1231="0" data-widgetel400eloffsetwidtheloffsetwidth500at1261="0" data-widgetel400eloffsetwidtheloffsetwidth500at1291="0" data-widgetel400eloffsetwidtheloffsetwidth500at1321="0" data-widgetel400eloffsetwidtheloffsetwidth500at1351="0" data-widgetel400eloffsetwidtheloffsetwidth500at1381="0" data-widgetel400eloffsetwidtheloffsetwidth500at1411="0" data-widgetel400eloffsetwidtheloffsetwidth500at1441="0" data-widgetel400eloffsetwidtheloffsetwidth500at1471="0" data-widgetel400eloffsetwidtheloffsetwidth500at1501="0" data-widgetel500eloffsetwidtheloffsetwidth600at1531="0" data-widgetel500eloffsetwidtheloffsetwidth600at1561="0" data-widgetel500eloffsetwidtheloffsetwidth600at1591="0" data-widgetel500eloffsetwidtheloffsetwidth600at1621="0" data-widgetel500eloffsetwidtheloffsetwidth600at1651="0" data-widgetel500eloffsetwidtheloffsetwidth600at1681="0" data-widgetel500eloffsetwidtheloffsetwidth600at1711="0" data-widgetel500eloffsetwidtheloffsetwidth600at1741="0" data-widgetel500eloffsetwidtheloffsetwidth600at1771="0" data-widgetel500eloffsetwidtheloffsetwidth600at1801="0" data-widgetel600eloffsetwidtheloffsetwidth700at1831="0" data-widgetel600eloffsetwidtheloffsetwidth700at1861="0" data-widgetel600eloffsetwidtheloffsetwidth700at1891="0" data-widgetel600eloffsetwidtheloffsetwidth700at1921="0" data-widgetel600eloffsetwidtheloffsetwidth700at1951="0" data-widgetel600eloffsetwidtheloffsetwidth700at1981="0" data-widgetel600eloffsetwidtheloffsetwidth700at2000="0"> <p>Qompile Demo</p> </div> <div class="widget" style="width:25%" data-widgetel100eloffsetwidtheloffsetwidth200at421="1" data-widgetel100eloffsetwidtheloffsetwidth200at451="1" data-widgetel100eloffsetwidtheloffsetwidth200at481="1" data-widgetel100eloffsetwidtheloffsetwidth200at511="1" data-widgetel100eloffsetwidtheloffsetwidth200at541="1" data-widgetel100eloffsetwidtheloffsetwidth200at571="1" data-widgetel100eloffsetwidtheloffsetwidth200at601="1" data-widgetel100eloffsetwidtheloffsetwidth200at631="0" data-widgetel100eloffsetwidtheloffsetwidth200at661="0" data-widgetel100eloffsetwidtheloffsetwidth200at691="0" data-widgetel100eloffsetwidtheloffsetwidth200at721="0" data-widgetel100eloffsetwidtheloffsetwidth200at751="0" data-widgetel100eloffsetwidtheloffsetwidth200at781="0" data-widgetel100eloffsetwidtheloffsetwidth200at811="0" data-widgetel200eloffsetwidtheloffsetwidth300at841="1" data-widgetel200eloffsetwidtheloffsetwidth300at871="1" data-widgetel200eloffsetwidtheloffsetwidth300at901="1" data-widgetel200eloffsetwidtheloffsetwidth300at931="0" data-widgetel200eloffsetwidtheloffsetwidth300at961="0" data-widgetel200eloffsetwidtheloffsetwidth300at991="0" data-widgetel200eloffsetwidtheloffsetwidth300at1021="0" data-widgetel200eloffsetwidtheloffsetwidth300at1051="0" data-widgetel200eloffsetwidtheloffsetwidth300at1081="0" data-widgetel200eloffsetwidtheloffsetwidth300at1111="0" data-widgetel200eloffsetwidtheloffsetwidth300at1141="0" data-widgetel200eloffsetwidtheloffsetwidth300at1171="0" data-widgetel200eloffsetwidtheloffsetwidth300at1201="0" data-widgetel300eloffsetwidtheloffsetwidth400at1231="0" data-widgetel300eloffsetwidtheloffsetwidth400at1261="0" data-widgetel300eloffsetwidtheloffsetwidth400at1291="0" data-widgetel300eloffsetwidtheloffsetwidth400at1321="0" data-widgetel300eloffsetwidtheloffsetwidth400at1351="0" data-widgetel300eloffsetwidtheloffsetwidth400at1381="0" data-widgetel300eloffsetwidtheloffsetwidth400at1411="0" data-widgetel300eloffsetwidtheloffsetwidth400at1441="0" data-widgetel300eloffsetwidtheloffsetwidth400at1471="0" data-widgetel300eloffsetwidtheloffsetwidth400at1501="0" data-widgetel300eloffsetwidtheloffsetwidth400at1531="0" data-widgetel300eloffsetwidtheloffsetwidth400at1561="0" data-widgetel300eloffsetwidtheloffsetwidth400at1591="0" data-widgetel400eloffsetwidtheloffsetwidth500at1621="0" data-widgetel400eloffsetwidtheloffsetwidth500at1651="0" data-widgetel400eloffsetwidtheloffsetwidth500at1681="0" data-widgetel400eloffsetwidtheloffsetwidth500at1711="0" data-widgetel400eloffsetwidtheloffsetwidth500at1741="0" data-widgetel400eloffsetwidtheloffsetwidth500at1771="0" data-widgetel400eloffsetwidtheloffsetwidth500at1801="0" data-widgetel400eloffsetwidtheloffsetwidth500at1831="0" data-widgetel400eloffsetwidtheloffsetwidth500at1861="0" data-widgetel400eloffsetwidtheloffsetwidth500at1891="0" data-widgetel400eloffsetwidtheloffsetwidth500at1921="0" data-widgetel400eloffsetwidtheloffsetwidth500at1951="0" data-widgetel400eloffsetwidtheloffsetwidth500at1981="0" data-widgetel400eloffsetwidtheloffsetwidth500at2000="0"> <p>Qompile Demo</p> </div></body></html>