├── .gitignore ├── Gruntfile.js ├── README.md ├── flags ├── algeria.html ├── armenia.html ├── austria.html ├── azerbaijan.html ├── bahamas.html ├── bangladesh.html ├── belgium.html ├── benin.html ├── botswana.html ├── brazil.html ├── bulgaria.html ├── burkina-faso.html ├── cameroon.html ├── chad.html ├── chile.html ├── china.html ├── colombia.html ├── comoros.html ├── css │ ├── algeria.css │ ├── armenia.css │ ├── austria.css │ ├── azerbaijan.css │ ├── bahamas.css │ ├── bangladesh.css │ ├── belgium.css │ ├── benin.css │ ├── bootstrap.css │ ├── bootstrap.min.css │ ├── botswana.css │ ├── brazil.css │ ├── bulgaria.css │ ├── burkina-faso.css │ ├── cameroon.css │ ├── chad.css │ ├── chile.css │ ├── china.css │ ├── colombia.css │ ├── comoros.css │ ├── cuba.css │ ├── czech-republic.css │ ├── djbouti.css │ ├── dominican-republic.css │ ├── drc.css │ ├── east-timor.css │ ├── estonia.css │ ├── finland.css │ ├── flags.css │ ├── france.css │ ├── gabon.css │ ├── gambia.css │ ├── germany.css │ ├── greece.css │ ├── iceland.css │ ├── ireland.css │ ├── japan.css │ ├── kenya.css │ ├── normalize.css │ ├── north-korea.css │ ├── norway.css │ ├── philippines.css │ ├── republic-of-the-congo.css │ ├── romania.css │ ├── rwanda.css │ ├── south-korea.css │ ├── styles.css │ ├── tanzania.css │ ├── tunisia.css │ ├── united-kingdom.css │ ├── usa.css │ ├── vietnam.css │ └── yemen.css ├── cuba.html ├── czech-republic.html ├── djbouti.html ├── dominican-republic.html ├── drc.html ├── east-timor.html ├── estonia.html ├── finland.html ├── france.html ├── gabon.html ├── gambia.html ├── germany.html ├── greece.html ├── iceland.html ├── ireland.html ├── japan.html ├── kenya.html ├── less │ ├── algeria.less │ ├── armenia.less │ ├── austria.less │ ├── azerbaijan.less │ ├── bahamas.less │ ├── bangladesh.less │ ├── belgium.less │ ├── benin.less │ ├── bootstrap.min.less │ ├── botswana.less │ ├── brazil.less │ ├── bulgaria.less │ ├── burkina-faso.less │ ├── cameroon.less │ ├── chad.less │ ├── chile.less │ ├── china.less │ ├── colombia.less │ ├── comoros.less │ ├── cuba.less │ ├── czech-republic.less │ ├── djbouti.less │ ├── dominican-republic.less │ ├── drc.less │ ├── east-timor.less │ ├── estonia.less │ ├── finland.less │ ├── flags.less │ ├── france.less │ ├── gabon.less │ ├── gambia.less │ ├── germany.less │ ├── greece.less │ ├── iceland.less │ ├── ireland.less │ ├── japan.less │ ├── kenya.less │ ├── mixins.less │ ├── normalize.less │ ├── north-korea.less │ ├── norway.less │ ├── philippines.less │ ├── republic-of-the-congo.less │ ├── romania.less │ ├── rwanda.less │ ├── south-korea.less │ ├── styles.less │ ├── tanzania.less │ ├── tunisia.less │ ├── united-kingdom.less │ ├── usa.less │ ├── vietnam.less │ └── yemen.less ├── north-korea.html ├── norway.html ├── philippines.html ├── republic-of-the-congo.html ├── romania.html ├── rwanda.html ├── south-korea.html ├── tanzania.html ├── tunisia.html ├── united-kingdom.html ├── usa.html ├── vietnam.html └── yemen.html └── package.json /.gitignore: -------------------------------------------------------------------------------- 1 | .DS_Store 2 | node_modules -------------------------------------------------------------------------------- /Gruntfile.js: -------------------------------------------------------------------------------- 1 | module.exports = function(grunt) { 2 | 3 | // Project configuration. 4 | grunt.initConfig({ 5 | pkg: grunt.file.readJSON('package.json'), 6 | less: { 7 | development: { 8 | options: { 9 | paths: ["flags/css"] 10 | }, 11 | files: [ 12 | { 13 | expand: true, 14 | cwd: 'flags/less', 15 | src: ['*.less'], 16 | dest: 'flags/css/', 17 | ext: '.css' 18 | } 19 | ] 20 | }, 21 | production: { 22 | options: { 23 | paths: ["flags/css"], 24 | cleancss: true 25 | }, 26 | files: [ 27 | { 28 | expand: true, 29 | cwd: 'flags/less', 30 | src: ['*.less'], 31 | dest: 'flags/css/', 32 | ext: '.css' 33 | } 34 | ] 35 | } 36 | } 37 | }); 38 | 39 | grunt.loadNpmTasks('grunt-contrib-less'); 40 | 41 | grunt.registerTask('default', ['less']); 42 | 43 | }; -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | Flags-in-CSS 2 | ============ 3 | 4 | Countries flags in pure CSS 5 | 6 | [View the project page](http://pattle.github.io/Flags-in-CSS "Flags in CSS") 7 | -------------------------------------------------------------------------------- /flags/algeria.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Algeria 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 | 26 | 27 | -------------------------------------------------------------------------------- /flags/armenia.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Armenia 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/austria.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Austria 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/azerbaijan.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Azerbaijan 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 | 28 | 29 | -------------------------------------------------------------------------------- /flags/bahamas.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Bahamas 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/bangladesh.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Bangladesh 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/belgium.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Belgium 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/benin.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Benin 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/botswana.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Botswana 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/brazil.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Brazil 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 | 23 | 24 | -------------------------------------------------------------------------------- /flags/bulgaria.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Bulgaria 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/burkina-faso.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Burkina Faso 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/cameroon.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Cameroon 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/chad.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Chad 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/chile.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Chile 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/china.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | China 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 | 26 | 27 | -------------------------------------------------------------------------------- /flags/colombia.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Colombia 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/comoros.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Comoros 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 | 29 | 30 | -------------------------------------------------------------------------------- /flags/css/algeria.css: -------------------------------------------------------------------------------- 1 | #algeria{position:relative;background-image:-webkit-linear-gradient(90deg,#006233 50%,#fff 50%);background-image:-o-linear-gradient(90deg,#006233 50%,#fff 50%);background-image:-moz-linear-gradient(90deg,#006233 50%,#fff 50%);background-image:linear-gradient(90deg,#006233 50%,#fff 50%);width:225px;height:150px}#algeria .middle{display:block;width:75px;top:37px;left:75px;height:75px;background:#fff;border-radius:50%}#algeria .moon{display:block;width:75px;top:0;left:0;height:75px;background:#e70013;border-radius:50%}#algeria .moon-clip{display:block;width:59px;top:8px;left:17px;height:59px;background-image:-webkit-linear-gradient(90deg,#006233 35%,#fff 35%);background-image:-o-linear-gradient(90deg,#006233 35%,#fff 35%);background-image:-moz-linear-gradient(90deg,#006233 35%,#fff 35%);background-image:linear-gradient(90deg,#006233 35%,#fff 35%);border-radius:50%}#algeria .star{margin:25px 0;position:absolute;top:-5px;left:4px;display:block;color:red;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #d21034;border-left:50px solid transparent;-moz-transform:rotate(65deg) scale(0.35,.35);-webkit-transform:rotate(55deg) scale(0.35,.35);-ms-transform:rotate(65deg) scale(0.35,.35);-o-transform:rotate(65deg) scale(0.35,.35)}#algeria .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #d21034;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#algeria .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;color:red;border-right:50px solid transparent;border-bottom:35px solid #d21034;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/armenia.css: -------------------------------------------------------------------------------- 1 | #armenia{background-image:-webkit-linear-gradient(#d90012 33%,#0033a0 33%,#0033a0 66%,#f2a800 66%);background-image:-o-linear-gradient(#d90012 33%,#0033a0 33%,#0033a0 66%,#f2a800 66%);background-image:-moz-linear-gradient(#d90012 33%,#0033a0 33%,#0033a0 66%,#f2a800 66%);background-image:linear-gradient(#d90012 33%,#0033a0 33%,#0033a0 66%,#f2a800 66%);width:300px;height:150px} -------------------------------------------------------------------------------- /flags/css/austria.css: -------------------------------------------------------------------------------- 1 | #austria{background-image:-webkit-linear-gradient(#ed2939 33%,#fff 33%,#fff 66%,#ed2939 66%);background-image:-o-linear-gradient(#ed2939 33%,#fff 33%,#fff 66%,#ed2939 66%);background-image:-moz-linear-gradient(#ed2939 33%,#fff 33%,#fff 66%,#ed2939 66%);background-image:linear-gradient(#ed2939 33%,#fff 33%,#fff 66%,#ed2939 66%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/azerbaijan.css: -------------------------------------------------------------------------------- 1 | #azerbaijan{position:relative;background-image:-webkit-linear-gradient(#0098c3 33%,#e00034 33%,#e00034 66%,#00ae65 66%);background-image:-o-linear-gradient(#0098c3 33%,#e00034 33%,#e00034 66%,#00ae65 66%);background-image:-moz-linear-gradient(#0098c3 33%,#e00034 33%,#e00034 66%,#00ae65 66%);background-image:linear-gradient(#0098c3 33%,#e00034 33%,#e00034 66%,#00ae65 66%);width:300px;height:150px}#azerbaijan .moon{display:block;width:45px;top:52px;left:123px;height:45px;background:#fff;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%}#azerbaijan .moon-clip{display:block;position:absolute;top:4px;left:8px;width:38px;height:38px;background:#e00034;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%}#azerbaijan .star{display:block;position:absolute;top:19px;left:36px;width:0;height:0;border-right:11px solid transparent;border-bottom:7px solid #fff;border-left:11px solid transparent;-moz-transform:rotate(112deg);-webkit-transform:rotate(112deg);-ms-transform:rotate(112deg);-o-transform:rotate(112deg)}#azerbaijan .star2{display:block;position:absolute;top:20px;left:36px;width:0;height:0;border-right:11px solid transparent;border-bottom:7px solid #fff;border-left:11px solid transparent;-moz-transform:rotate(24deg);-webkit-transform:rotate(24deg);-ms-transform:rotate(24deg);-o-transform:rotate(24deg)}#azerbaijan .star3{display:block;position:absolute;top:20px;left:37px;width:0;height:0;border-right:11px solid transparent;border-bottom:7px solid #fff;border-left:11px solid transparent;-moz-transform:rotate(24deg);-webkit-transform:rotate(-67deg);-ms-transform:rotate(24deg);-o-transform:rotate(24deg)}#azerbaijan .star4{display:block;position:absolute;top:19px;left:36px;width:0;height:0;border-right:11px solid transparent;border-bottom:7px solid #fff;border-left:11px solid transparent;-moz-transform:rotate(-157deg);-webkit-transform:rotate(-157deg);-ms-transform:rotate(-157deg);-o-transform:rotate(-157deg)} -------------------------------------------------------------------------------- /flags/css/bahamas.css: -------------------------------------------------------------------------------- 1 | #bahamas{position:relative;background-image:-webkit-linear-gradient(#00abc9 33%,#fae042 33%,#fae042 66%,#00abc9 66%);background-image:-o-linear-gradient(#00abc9 33%,#fae042 33%,#fae042 66%,#00abc9 66%);background-image:-moz-linear-gradient(#00abc9 33%,#fae042 33%,#fae042 66%,#00abc9 66%);background-image:linear-gradient(#00abc9 33%,#fae042 33%,#fae042 66%,#00abc9 66%);width:300px;height:150px}#bahamas .triangle{top:0;left:0;width:0;height:0;border-top:75px solid transparent;border-bottom:75px solid transparent;border-left:100px solid #000} -------------------------------------------------------------------------------- /flags/css/bangladesh.css: -------------------------------------------------------------------------------- 1 | #bangladesh{position:relative;background:#006a4e;width:250px;height:150px}#bangladesh .middle{display:block;width:100px;top:25px;left:62px;height:100px;background:#f42a41;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%} -------------------------------------------------------------------------------- /flags/css/belgium.css: -------------------------------------------------------------------------------- 1 | #belgium{background-image:-webkit-linear-gradient(90deg,#000 33%,#fae042 33%,#fae042 66%,#ed2939 66%);background-image:-o-linear-gradient(90deg,#000 33%,#fae042 33%,#fae042 66%,#ed2939 66%);background-image:-moz-linear-gradient(90deg,#000 33%,#fae042 33%,#fae042 66%,#ed2939 66%);background-image:linear-gradient(90deg,#000 33%,#fae042 33%,#fae042 66%,#ed2939 66%);width:173px;height:150px} -------------------------------------------------------------------------------- /flags/css/benin.css: -------------------------------------------------------------------------------- 1 | #benin{background-image:-webkit-linear-gradient(90deg,#008751 40%,transparent 40%),linear-gradient(#fcd116 50%,#e8112d 50%);background-image:-o-linear-gradient(90deg,#008751 40%,transparent 40%),linear-gradient(#fcd116 50%,#e8112d 50%);background-image:-moz-linear-gradient(90deg,#008751 40%,transparent 40%),linear-gradient(#fcd116 50%,#e8112d 50%);background-image:linear-gradient(90deg,#008751 40%,transparent 40%),linear-gradient(#fcd116 50%,#e8112d 50%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/botswana.css: -------------------------------------------------------------------------------- 1 | #botswana{background-image:-webkit-linear-gradient(#75aadb 37%,#fff 37%,#fff 41%,#000 41%,#000 59%,#fff 59%,#fff 63%,#75aadb 63%);background-image:-o-linear-gradient(#75aadb 37%,#fff 37%,#fff 41%,#000 41%,#000 59%,#fff 59%,#fff 63%,#75aadb 63%);background-image:-moz-linear-gradient(#75aadb 37%,#fff 37%,#fff 41%,#000 41%,#000 59%,#fff 59%,#fff 63%,#75aadb 63%);background-image:linear-gradient(#75aadb 37%,#fff 37%,#fff 41%,#000 41%,#000 59%,#fff 59%,#fff 63%,#75aadb 63%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/brazil.css: -------------------------------------------------------------------------------- 1 | #brazil{position:relative;background-color:#16b83e;width:250px;height:150px}#brazil .circle,#brazil .losangue:before,#brazil .losangue:after{position:absolute}#brazil .losangue{width:100%;height:100%;top:0;bottom:0;left:0;right:0}#brazil .losangue:before,#brazil .losangue:after{content:'';width:0;height:0;left:20px;right:20px}#brazil .losangue:before{border-left:105px solid transparent;border-right:105px solid transparent;border-bottom:65px solid #ffe11f;top:10px}#brazil .losangue:after{border-left:105px solid transparent;border-right:105px solid transparent;border-top:65px solid #ffe11f;bottom:10px}#brazil .circle{overflow:hidden;z-index:2;display:block;background-color:#1651b8;height:80px;width:80px;margin-top:-40px;margin-left:-40px}#brazil .circle,#brazil .circle:before,#brazil .circle:after{top:50%;left:50%;position:absolute;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%}#brazil .circle:before,#brazil .circle:after{width:90px;height:40px;-ms-transform:rotate(14deg);-webkit-transform:rotate(14deg);transform:rotate(14deg)}#brazil .circle:before{z-index:3;content:'';margin-top:-20px;margin-left:-45px;background:#fff}#brazil .circle:after{z-index:4;content:'';margin-top:-10px;margin-left:-48px;background-color:#1651b8} -------------------------------------------------------------------------------- /flags/css/bulgaria.css: -------------------------------------------------------------------------------- 1 | #bulgaria{background-image:-webkit-linear-gradient(#fff 33%,#00966e 33%,#00966e 66%,#d62612 66%);background-image:-o-linear-gradient(#fff 33%,#00966e 33%,#00966e 66%,#d62612 66%);background-image:-moz-linear-gradient(#fff 33%,#00966e 33%,#00966e 66%,#d62612 66%);background-image:linear-gradient(#fff 33%,#00966e 33%,#00966e 66%,#d62612 66%);width:250px;height:150px} -------------------------------------------------------------------------------- /flags/css/burkina-faso.css: -------------------------------------------------------------------------------- 1 | #burkina-faso{position:relative;background-image:-webkit-linear-gradient(#ef2b2d 50%,#009e49 50%);background-image:-o-linear-gradient(#ef2b2d 50%,#009e49 50%);background-image:-moz-linear-gradient(#ef2b2d 50%,#009e49 50%);background-image:linear-gradient(#ef2b2d 50%,#009e49 50%);width:225px;height:150px}#burkina-faso .star{display:block;top:57px;left:63px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fcd116;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.46,.46);-webkit-transform:rotate(35deg) scale(0.46,.46);-ms-transform:rotate(35deg) scale(0.46,.46);-o-transform:rotate(35deg) scale(0.46,.46)}#burkina-faso .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #fcd116;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#burkina-faso .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fcd116;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/cameroon.css: -------------------------------------------------------------------------------- 1 | #cameroon{position:relative;background-image:-webkit-linear-gradient(90deg,#007a5e 33%,#ce1126 33%,#ce1126 66%,#fcd116 66%);background-image:-o-linear-gradient(90deg,#007a5e 33%,#ce1126 33%,#ce1126 66%,#fcd116 66%);background-image:-moz-linear-gradient(90deg,#007a5e 33%,#ce1126 33%,#ce1126 66%,#fcd116 66%);background-image:linear-gradient(90deg,#007a5e 33%,#ce1126 33%,#ce1126 66%,#fcd116 66%);width:225px;height:150px}#cameroon .star{display:block;top:57px;left:63px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fcd116;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.46,.46);-webkit-transform:rotate(35deg) scale(0.46,.46);-ms-transform:rotate(35deg) scale(0.46,.46);-o-transform:rotate(35deg) scale(0.46,.46)}#cameroon .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #fcd116;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#cameroon .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fcd116;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/chad.css: -------------------------------------------------------------------------------- 1 | #chad{background-image:-webkit-linear-gradient(90deg,#002664 33%,#fecb00 33%,#fecb00 66%,#c60c30 66%);background-image:-o-linear-gradient(90deg,#002664 33%,#fecb00 33%,#fecb00 66%,#c60c30 66%);background-image:-moz-linear-gradient(90deg,#002664 33%,#fecb00 33%,#fecb00 66%,#c60c30 66%);background-image:linear-gradient(90deg,#002664 33%,#fecb00 33%,#fecb00 66%,#c60c30 66%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/chile.css: -------------------------------------------------------------------------------- 1 | #chile{position:relative;background-image:-webkit-linear-gradient(90deg,#0039a6 75px,transparent 75px),linear-gradient(#fff 50%,#d52b1e 50%);background-image:-o-linear-gradient(90deg,#0039a6 75px,transparent 75px),linear-gradient(#fff 50%,#d52b1e 50%);background-image:-moz-linear-gradient(90deg,#0039a6 75px,transparent 75px),linear-gradient(#fff 50%,#d52b1e 50%);background-image:linear-gradient(90deg,#0039a6 75px,transparent 75px),linear-gradient(#fff 50%,#d52b1e 50%);background-size:225px 75px,225px 150px;background-repeat:no-repeat,no-repeat;width:225px;height:150px}#chile .star{display:block;position:absolute;top:19px;left:-12px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.35,.35);-webkit-transform:rotate(35deg) scale(0.35,.35);-ms-transform:rotate(35deg) scale(0.35,.35);-o-transform:rotate(35deg) scale(0.35,.35)}#chile .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #fff;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#chile .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/china.css: -------------------------------------------------------------------------------- 1 | #china{position:relative;background:#de2910;width:225px;height:150px}#china .star{display:block;position:absolute;top:19px;left:-12px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #ffde00;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.45,.45);-webkit-transform:rotate(35deg) scale(0.45,.45);-ms-transform:rotate(35deg) scale(0.45,.45);-o-transform:rotate(35deg) scale(0.45,.45)}#china .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #ffde00;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#china .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #ffde00;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)}#china .star-main{top:19px;left:-12px;-moz-transform:rotate(35deg) scale(0.45,.45);-webkit-transform:rotate(35deg) scale(0.45,.45);-ms-transform:rotate(35deg) scale(0.45,.45);-o-transform:rotate(35deg) scale(0.45,.45)}#china .star-sub1{top:-3px;left:25px;-moz-transform:rotate(55deg) scale(0.12,.12);-webkit-transform:rotate(55deg) scale(0.12,.12);-ms-transform:rotate(55deg) scale(0.12,.12);-o-transform:rotate(55deg) scale(0.12,.12)}#china .star-sub2{top:12px;left:40px;-moz-transform:rotate(10deg) scale(0.12,.12);-webkit-transform:rotate(10deg) scale(0.12,.12);-ms-transform:rotate(10deg) scale(0.12,.12);-o-transform:rotate(10deg) scale(0.12,.12)}#china .star-sub3{top:35px;left:40px;-moz-transform:rotate(33deg) scale(0.12,.12);-webkit-transform:rotate(33deg) scale(0.12,.12);-ms-transform:rotate(33deg) scale(0.12,.12);-o-transform:rotate(33deg) scale(0.12,.12)}#china .star-sub4{top:50px;left:25px;-moz-transform:rotate(35deg) scale(0.12,.12);-webkit-transform:rotate(55deg) scale(0.12,.12);-ms-transform:rotate(35deg) scale(0.12,.12);-o-transform:rotate(35deg) scale(0.12,.12)} -------------------------------------------------------------------------------- /flags/css/colombia.css: -------------------------------------------------------------------------------- 1 | #colombia{background-image:-webkit-linear-gradient(#fcd116 50%,#003893 50%,#003893 75%,#ce1126 75%);background-image:-o-linear-gradient(#fcd116 50%,#003893 50%,#003893 75%,#ce1126 75%);background-image:-moz-linear-gradient(#fcd116 50%,#003893 50%,#003893 75%,#ce1126 75%);background-image:linear-gradient(#fcd116 50%,#003893 50%,#003893 75%,#ce1126 75%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/comoros.css: -------------------------------------------------------------------------------- 1 | #comoros{position:relative;background-image:-webkit-linear-gradient(#ffc61e 25%,#fff 25%,#fff 50%,#ce1126 50%,#ce1126 75%,#3a75c4 75%);background-image:-o-linear-gradient(#ffc61e 25%,#fff 25%,#fff 50%,#ce1126 50%,#ce1126 75%,#3a75c4 75%);background-image:-moz-linear-gradient(#ffc61e 25%,#fff 25%,#fff 50%,#ce1126 50%,#ce1126 75%,#3a75c4 75%);background-image:linear-gradient(#ffc61e 25%,#fff 25%,#fff 50%,#ce1126 50%,#ce1126 75%,#3a75c4 75%);width:208px;height:125px}#comoros .triangle{top:0;left:0;width:0;height:0;border-top:62.5px solid transparent;border-bottom:62.5px solid transparent;border-left:104px solid #3d8e33}#comoros .moon{top:33px;left:7px;width:60px;height:58px;background:#fff;border-radius:50%}#comoros .moon .moon-clip{top:0;left:13px;width:55px;height:58px;background:#3d8e33;border-radius:50%}#comoros .moon .star{display:block;left:-15px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.1,.1);-webkit-transform:rotate(35deg) scale(0.1,.1);-ms-transform:rotate(35deg) scale(0.1,.1);-o-transform:rotate(35deg) scale(0.1,.1)}#comoros .moon .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #fff;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#comoros .moon .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)}#comoros .moon .star1{top:-8px}#comoros .moon .star2{top:5px}#comoros .moon .star3{top:19px}#comoros .moon .star4{top:32px} -------------------------------------------------------------------------------- /flags/css/cuba.css: -------------------------------------------------------------------------------- 1 | #cuba{position:relative;background-image:-webkit-linear-gradient(#002a8f 20%,#fff 20%,#fff 40%,#002a8f 40%,#002a8f 60%,#fff 60%,#fff 80%,#002a8f 80%);background-image:-o-linear-gradient(#002a8f 20%,#fff 20%,#fff 40%,#002a8f 40%,#002a8f 60%,#fff 60%,#fff 80%,#002a8f 80%);background-image:-moz-linear-gradient(#002a8f 20%,#fff 20%,#fff 40%,#002a8f 40%,#002a8f 60%,#fff 60%,#fff 80%,#002a8f 80%);background-image:linear-gradient(#002a8f 20%,#fff 20%,#fff 40%,#002a8f 40%,#002a8f 60%,#fff 60%,#fff 80%,#002a8f 80%);width:300px;height:150px}#cuba .triangle{top:0;left:0;width:0;height:0;border-top:75px solid transparent;border-bottom:75px solid transparent;border-left:130px solid #cf142b}#cuba .star{display:block;top:57px;left:-6px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.42,.42);-webkit-transform:rotate(35deg) scale(0.42,.42);-ms-transform:rotate(35deg) scale(0.42,.42);-o-transform:rotate(35deg) scale(0.42,.42)}#cuba .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #fff;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#cuba .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/czech-republic.css: -------------------------------------------------------------------------------- 1 | #czech-republic{background-image:linear-gradient(35deg,#11457e 50%,transparent 50%),linear-gradient(-35deg,transparent 50%,#11457e 50%),linear-gradient(#fff 50%,#d7141a 50%);background-size:110px 75px,110px 75px,225px 150px;background-position:0 0,0 75px,0 0;background-repeat:no-repeat,no-repeat,repeat;width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/djbouti.css: -------------------------------------------------------------------------------- 1 | #djbouti{position:relative;background-image:linear-gradient(30deg,#fff 50%,transparent 50%),linear-gradient(-30deg,transparent 50%,#fff 50%),linear-gradient(#6ab2e7 50%,#12ad2b 50%);background-size:130px 75px,130px 75px,225px 150px;background-position:0 0,0 75px,0 0;background-repeat:no-repeat,no-repeat,repeat;width:225px;height:150px}#djbouti .star{display:block;top:59px;left:0;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #d7141a;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.38,.38);-webkit-transform:rotate(35deg) scale(0.38,.38);-ms-transform:rotate(35deg) scale(0.38,.38);-o-transform:rotate(35deg) scale(0.38,.38)}#djbouti .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #d7141a;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#djbouti .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #d7141a;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/dominican-republic.css: -------------------------------------------------------------------------------- 1 | #dominican-republic{background-color:#002d62;background-image:linear-gradient(#fff 30px,transparent 30px),linear-gradient(90deg,#fff 30px,transparent 30px),linear-gradient(90deg,#ce1126 111px,transparent 111px),linear-gradient(90deg,transparent 111px,#ce1126 111px);background-size:250px 93px,140px 156px,250px 63px,250px 63px;background-position:0 -30px,-30px 0,0 93px,0 0;background-repeat:repeat,repeat,no-repeat,no-repeat;width:250px;height:156px} -------------------------------------------------------------------------------- /flags/css/drc.css: -------------------------------------------------------------------------------- 1 | #drc{position:relative;background-image:-webkit-linear-gradient(-30deg,#007fff 41%,#f7d618 41%,#f7d618 44%,#ce1021 44%,#ce1021 56%,#f7d618 56%,#f7d618 59%,#007fff 59%);background-image:-o-linear-gradient(-30deg,#007fff 41%,#f7d618 41%,#f7d618 44%,#ce1021 44%,#ce1021 56%,#f7d618 56%,#f7d618 59%,#007fff 59%);background-image:-moz-linear-gradient(-30deg,#007fff 41%,#f7d618 41%,#f7d618 44%,#ce1021 44%,#ce1021 56%,#f7d618 56%,#f7d618 59%,#007fff 59%);background-image:linear-gradient(-30deg,#007fff 41%,#f7d618 41%,#f7d618 44%,#ce1021 44%,#ce1021 56%,#f7d618 56%,#f7d618 59%,#007fff 59%);width:200px;height:150px}#drc .star{display:block;position:absolute;top:21px;left:-12px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #f7d618;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.53,.53);-webkit-transform:rotate(35deg) scale(0.53,.53);-ms-transform:rotate(35deg) scale(0.53,.53);-o-transform:rotate(35deg) scale(0.53,.53)}#drc .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #f7d618;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#drc .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #f7d618;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/east-timor.css: -------------------------------------------------------------------------------- 1 | #east-timor{position:relative;background-color:#dc241f;background-image:linear-gradient(37deg,#000 50%,transparent 50%),linear-gradient(-37deg,transparent 50%,#000 50%),linear-gradient(27deg,#ffc726 50%,transparent 50%),linear-gradient(-27deg,transparent 50%,#ffc726 50%);background-size:100px 75px,100px 75px,150px 75px,150px 75px;background-position:0 0,0 75px,0 0,0 75px;background-repeat:no-repeat,no-repeat,no-repeat,no-repeat;width:300px;height:150px}#east-timor .star{display:block;top:56px;left:-12px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-moz-transform:rotate(8deg) scale(0.48,.48);-webkit-transform:rotate(8deg) scale(0.48,.48);-ms-transform:rotate(8deg) scale(0.48,.48);-o-transform:rotate(8deg) scale(0.48,.48)}#east-timor .star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #fff;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#east-timor .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/estonia.css: -------------------------------------------------------------------------------- 1 | #estonia{background-image:-webkit-linear-gradient(#4891d9 33%,#000 33%,#000 66%,#fff 66%);background-image:-o-linear-gradient(#4891d9 33%,#000 33%,#000 66%,#fff 66%);background-image:-moz-linear-gradient(#4891d9 33%,#000 33%,#000 66%,#fff 66%);background-image:linear-gradient(#4891d9 33%,#000 33%,#000 66%,#fff 66%);width:236px;height:150px} -------------------------------------------------------------------------------- /flags/css/finland.css: -------------------------------------------------------------------------------- 1 | #finland{background-color:#fff;background-image:linear-gradient(transparent 54px,#003580 54px),linear-gradient(90deg,transparent 68px,#003580 68px);background-size:246px 96px,110px 150px;background-repeat:no-repeat;width:246px;height:150px} -------------------------------------------------------------------------------- /flags/css/flags.css: -------------------------------------------------------------------------------- 1 | .flag{margin:0 auto}.flag *{position:absolute;box-sizing:content-box;-moz-box-sizing:content-box} -------------------------------------------------------------------------------- /flags/css/france.css: -------------------------------------------------------------------------------- 1 | #france{background-image:-webkit-linear-gradient(90deg,#0055a4 33%,#fff 33%,#fff 66%,#ef4135 66%);background-image:-o-linear-gradient(90deg,#0055a4 33%,#fff 33%,#fff 66%,#ef4135 66%);background-image:-moz-linear-gradient(90deg,#0055a4 33%,#fff 33%,#fff 66%,#ef4135 66%);background-image:linear-gradient(90deg,#0055a4 33%,#fff 33%,#fff 66%,#ef4135 66%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/gabon.css: -------------------------------------------------------------------------------- 1 | #gabon{background-image:-webkit-linear-gradient(#009e60 33%,#fcd116 33%,#fcd116 66%,#3a75c4 66%);background-image:-o-linear-gradient(#009e60 33%,#fcd116 33%,#fcd116 66%,#3a75c4 66%);background-image:-moz-linear-gradient(#009e60 33%,#fcd116 33%,#fcd116 66%,#3a75c4 66%);background-image:linear-gradient(#009e60 33%,#fcd116 33%,#fcd116 66%,#3a75c4 66%);width:200px;height:150px} -------------------------------------------------------------------------------- /flags/css/gambia.css: -------------------------------------------------------------------------------- 1 | #gambia{background-image:-webkit-linear-gradient(#ce1126 33%,#fff 33%,#fff 38%,#0c1c8c 38%,#0c1c8c 62%,#fff 62%,#fff 67%,#3a7728 67%);background-image:-o-linear-gradient(#ce1126 33%,#fff 33%,#fff 38%,#0c1c8c 38%,#0c1c8c 62%,#fff 62%,#fff 67%,#3a7728 67%);background-image:-moz-linear-gradient(#ce1126 33%,#fff 33%,#fff 38%,#0c1c8c 38%,#0c1c8c 62%,#fff 62%,#fff 67%,#3a7728 67%);background-image:linear-gradient(#ce1126 33%,#fff 33%,#fff 38%,#0c1c8c 38%,#0c1c8c 62%,#fff 62%,#fff 67%,#3a7728 67%);width:200px;height:133px} -------------------------------------------------------------------------------- /flags/css/germany.css: -------------------------------------------------------------------------------- 1 | #germany{background-image:-webkit-linear-gradient(#000 33%,#d00 33%,#d00 66%,#ffce00 66%);background-image:-o-linear-gradient(#000 33%,#d00 33%,#d00 66%,#ffce00 66%);background-image:-moz-linear-gradient(#000 33%,#d00 33%,#d00 66%,#ffce00 66%);background-image:linear-gradient(#000 33%,#d00 33%,#d00 66%,#ffce00 66%);width:250px;height:133px} -------------------------------------------------------------------------------- /flags/css/greece.css: -------------------------------------------------------------------------------- 1 | #greece{background-image:-webkit-linear-gradient(90deg,transparent 15%,#fff 15%,#fff 22.5%,transparent 22.5%),-webkit-linear-gradient(transparent 22%,#fff 22%,#fff 33%,transparent 33%),-webkit-linear-gradient(#0d5eaf 50%,#0d5eaf 50%),-webkit-linear-gradient(#0d5eaf 50%,#fff 50%);background-image:-o-linear-gradient(90deg,transparent 15%,#fff 15%,#fff 22.5%,transparent 22.5%),-o-linear-gradient(transparent 22%,#fff 22%,#fff 33%,transparent 33%),-o-linear-gradient(#0d5eaf 50%,#0d5eaf 50%),-o-linear-gradient(#0d5eaf 50%,#fff 50%);background-image:-moz-linear-gradient(90deg,transparent 15%,#fff 15%,#fff 22.5%,transparent 22.5%),-moz-linear-gradient(transparent 22%,#fff 22%,#fff 33%,transparent 33%),-moz-linear-gradient(#0d5eaf 50%,#0d5eaf 50%),-moz-linear-gradient(#0d5eaf 50%,#fff 50%);background-image:linear-gradient(90deg,transparent 15%,#fff 15%,#fff 22.5%,transparent 22.5%),linear-gradient(transparent 22%,#fff 22%,#fff 33%,transparent 33%),linear-gradient(#0d5eaf 50%,#0d5eaf 50%),linear-gradient(#0d5eaf 50%,#fff 50%);background-size:100% 55%,36.6% 100%,36.8% 55%,100% 22.2%;background-repeat:no-repeat,no-repeat,no-repeat,repeat;width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/iceland.css: -------------------------------------------------------------------------------- 1 | #iceland{background-color:#003897;background-image:-webkit-linear-gradient(#d72828 16px,transparent 16px),linear-gradient(90deg,#d72828 16px,transparent 16px),linear-gradient(#fff 32px,transparent 32px),linear-gradient(90deg,#fff 32px,transparent 32px);background-image:-o-linear-gradient(#d72828 16px,transparent 16px),linear-gradient(90deg,#d72828 16px,transparent 16px),linear-gradient(#fff 32px,transparent 32px),linear-gradient(90deg,#fff 32px,transparent 32px);background-image:-moz-linear-gradient(#d72828 16px,transparent 16px),linear-gradient(90deg,#d72828 16px,transparent 16px),linear-gradient(#fff 32px,transparent 32px),linear-gradient(90deg,#fff 32px,transparent 32px);background-image:linear-gradient(#d72828 16px,transparent 16px),linear-gradient(90deg,#d72828 16px,transparent 16px),linear-gradient(#fff 32px,transparent 32px),linear-gradient(90deg,#fff 32px,transparent 32px);background-size:121px 91px,143px 91px,21px 91px,165px 91px;background-position:-24px -24px,-77px -24px,-32px -32px,-107px -32px;width:209px;height:150px} -------------------------------------------------------------------------------- /flags/css/ireland.css: -------------------------------------------------------------------------------- 1 | #ireland{background-image:-webkit-linear-gradient(90deg,#009a49 33%,#fff 33%,#fff 66%,#ff7900 66%);background-image:-o-linear-gradient(90deg,#009a49 33%,#fff 33%,#fff 66%,#ff7900 66%);background-image:-moz-linear-gradient(90deg,#009a49 33%,#fff 33%,#fff 66%,#ff7900 66%);background-image:linear-gradient(90deg,#009a49 33%,#fff 33%,#fff 66%,#ff7900 66%);width:250px;height:125px} -------------------------------------------------------------------------------- /flags/css/japan.css: -------------------------------------------------------------------------------- 1 | #japan{position:relative;background:#fff;width:225px;height:150px;border:1px solid #ddd}#japan .middle{display:block;width:91px;top:29px;left:67px;height:91px;background:#bc002d;border-radius:50%;-webkit-border-radius:50%;-moz-border-radius:50%} -------------------------------------------------------------------------------- /flags/css/kenya.css: -------------------------------------------------------------------------------- 1 | #kenya{position:relative;background-image:-webkit-linear-gradient(#000 30%,#fff 30%,#fff 35%,#b00 35%,#b00 61%,#fff 61%,#fff 66%,#060 66%);background-image:-o-linear-gradient(#000 30%,#fff 30%,#fff 35%,#b00 35%,#b00 61%,#fff 61%,#fff 66%,#060 66%);background-image:-moz-linear-gradient(#000 30%,#fff 30%,#fff 35%,#b00 35%,#b00 61%,#fff 61%,#fff 66%,#060 66%);background-image:linear-gradient(#000 30%,#fff 30%,#fff 35%,#b00 35%,#b00 61%,#fff 61%,#fff 66%,#060 66%);width:225px;height:150px}#kenya .spear-left{top:37px;left:108px;width:2px;height:89px;background:#fff;-webkit-transform:rotate(30deg);-ms-transform:rotate(30deg);transform:rotate(30deg)}#kenya .spear-left:after{content:" ";top:-22px;left:-2px;width:6px;height:23px;background:#fff;position:absolute;-webkit-border-radius:50% 50% 40% .8% 50% 20% 20%;-moz-border-radius:50% 50% 40% .8% 50% 20% 20%;border-radius:50% 50% 40% .8% 50% 20% 20%}#kenya .spear-right{top:37px;left:115px;width:2px;height:89px;background:#fff;-webkit-transform:rotate(-30deg);-ms-transform:rotate(-30deg);transform:rotate(-30deg)}#kenya .spear-right:after{content:" ";top:-22px;left:-2px;width:6px;height:23px;background:#fff;position:absolute;-webkit-border-radius:50% 50% 40% .8% 50% 20% 20%;-moz-border-radius:50% 50% 40% .8% 50% 20% 20%;border-radius:50% 50% 40% .8% 50% 20% 20%}#kenya .shield{top:31px;left:90px;width:45px;height:89px;background:#b00;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}#kenya .shield-left{top:23px;left:0;width:9px;height:41px;background:#000;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}#kenya .shield-right{top:23px;right:0;width:9px;height:41px;background:#000;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}#kenya .shield-top{top:0;left:18px;width:9px;height:39px;background:#fff;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}#kenya .shield-bottom{bottom:0;left:18px;width:9px;height:39px;background:#fff;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}#kenya .shield-line{top:0;left:22px;width:1px;height:89px;background:#b00}#kenya .shield-middle{top:39px;left:19px;width:7px;height:10px;background:#fff;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%} -------------------------------------------------------------------------------- /flags/css/normalize.css: -------------------------------------------------------------------------------- 1 | /*! normalize.css v1.1.3 | MIT License | git.io/normalize */article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block}audio,canvas,video{display:inline-block;;}audio:not([controls]){display:none;height:0}[hidden]{display:none}html{font-size:100%;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%}html,button,input,select,textarea{font-family:sans-serif}body{margin:0}a:focus{outline:thin dotted}a:active,a:hover{outline:0}h1{font-size:2em;margin:.67em 0}h2{font-size:1.5em;margin:.83em 0}h3{font-size:1.17em;margin:1em 0}h4{font-size:1em;margin:1.33em 0}h5{font-size:.83em;margin:1.67em 0}h6{font-size:.67em;margin:2.33em 0}abbr[title]{border-bottom:1px dotted}b,strong{font-weight:700}blockquote{margin:1em 40px}dfn{font-style:italic}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0}mark{background:#ff0;color:#000}p,pre{margin:1em 0}code,kbd,pre,samp{font-family:monospace,serif;;font-size:1em}pre{white-space:pre;white-space:pre-wrap;word-wrap:break-word}q{quotes:none}q:before,q:after{content:'';content:none}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sup{top:-.5em}sub{bottom:-.25em}dl,menu,ol,ul{margin:1em 0}dd{margin:0 0 0 40px}menu,ol,ul{padding:0 0 0 40px}nav ul,nav ol{list-style:none;list-style-image:none}img{border:0;-ms-interpolation-mode:bicubic}svg:not(:root){overflow:hidden}figure{margin:0}form{margin:0}fieldset{border:1px solid silver;margin:0 2px;padding:.35em .625em .75em}legend{border:0;padding:0;white-space:normal;}button,input,select,textarea{font-size:100%;margin:0;vertical-align:baseline;}button,input{line-height:normal}button,select{text-transform:none}button,html input[type=button],input[type=reset],input[type=submit]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default}input[type=checkbox],input[type=radio]{box-sizing:border-box;padding:0;;}input[type=search]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box}input[type=search]::-webkit-search-cancel-button,input[type=search]::-webkit-search-decoration{-webkit-appearance:none}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0}textarea{overflow:auto;vertical-align:top}table{border-collapse:collapse;border-spacing:0} -------------------------------------------------------------------------------- /flags/css/north-korea.css: -------------------------------------------------------------------------------- 1 | #north-korea{position:relative;background-image:-webkit-linear-gradient(#024fa2 17%,#fff 17%,#fff 19.5%,#ed1c27 19.5%,#ed1c27 80.5%,#fff 80.5%,#fff 83%,#024fa2 83%);background-image:-o-linear-gradient(#024fa2 17%,#fff 17%,#fff 19.5%,#ed1c27 19.5%,#ed1c27 80.5%,#fff 80.5%,#fff 83%,#024fa2 83%);background-image:-moz-linear-gradient(#024fa2 17%,#fff 17%,#fff 19.5%,#ed1c27 19.5%,#ed1c27 80.5%,#fff 80.5%,#fff 83%,#024fa2 83%);background-image:linear-gradient(#024fa2 17%,#fff 17%,#fff 19.5%,#ed1c27 19.5%,#ed1c27 80.5%,#fff 80.5%,#fff 83%,#024fa2 83%);width:300px;height:150px}#north-korea:after{content:" ";position:absolute;top:28%;left:22%;width:22%;height:44%;background:#fff;-webkit-border-radius:50%;-moz-border-radius:50%;border-radius:50%}#north-korea .star{display:block;position:absolute;top:56px;left:51px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #ed1c27;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.6,.6);-webkit-transform:rotate(35deg) scale(0.6,.6);-ms-transform:rotate(35deg) scale(0.6,.6);-o-transform:rotate(35deg) scale(0.6,.6);z-index:99}#north-korea .star:before{content:'';display:block;position:absolute;top:-25.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #ed1c27;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#north-korea .star:after{content:'';display:block;position:absolute;top:1px;left:-50.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #ed1c27;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)} -------------------------------------------------------------------------------- /flags/css/norway.css: -------------------------------------------------------------------------------- 1 | #norway{background-color:#ef2b2d;background-image:-webkit-linear-gradient(#002868 16px,transparent 16px),linear-gradient(90deg,#002868 16px,transparent 16px),linear-gradient(#fff 32px,transparent 32px),linear-gradient(90deg,#fff 32px,transparent 32px);background-image:-o-linear-gradient(#002868 16px,transparent 16px),linear-gradient(90deg,#002868 16px,transparent 16px),linear-gradient(#fff 32px,transparent 32px),linear-gradient(90deg,#fff 32px,transparent 32px);background-image:-moz-linear-gradient(#002868 16px,transparent 16px),linear-gradient(90deg,#002868 16px,transparent 16px),linear-gradient(#fff 32px,transparent 32px),linear-gradient(90deg,#fff 32px,transparent 32px);background-image:linear-gradient(transparent 67px,#002868 67px),linear-gradient(90deg,transparent 67px,#002868 67px),linear-gradient(transparent 59px,#fff 59px),linear-gradient(90deg,transparent 59px,#fff 59px);background-size:209px 83px,83px 150px,209px 91px,91px 150px;background-repeat:no-repeat;width:209px;height:150px} -------------------------------------------------------------------------------- /flags/css/philippines.css: -------------------------------------------------------------------------------- 1 | #philippines{width:300px;height:150px;position:relative;background-image:-webkit-linear-gradient(#0038a8 50%,#ce1126 50%);background-image:-o-linear-gradient(#0038a8 50%,#ce1126 50%);background-image:linear-gradient(#0038a8 50%,#ce1126 50%)}#philippines .triangle{border-top:75px solid transparent;border-bottom:75px solid transparent;border-left:130px solid #fff}#philippines .star{color:#FCD116;font-size:20px;position:absolute}#philippines .star:before{content:'★'}#philippines .star.first{top:4px;left:2px;-webkit-transform:rotate(-30deg);-ms-transform:rotate(-30deg);transform:rotate(-30deg)}#philippines .star.second{bottom:8px;left:2px;-webkit-transform:rotate(-7.5deg);-ms-transform:rotate(-7.5deg);transform:rotate(-7.5deg)}#philippines .star.third{top:60px;left:97px;-webkit-transform:rotate(17.5deg);-ms-transform:rotate(17.5deg);transform:rotate(17.5deg)}#philippines .sun{background:#FCD116;position:absolute;height:34px;width:34px;left:30px;top:58px;border-radius:17px}#philippines .sun .ray:nth-child(1){top:-24px;left:10px}#philippines .sun .ray:nth-child(2){left:-13px;top:-13px;-webkit-transform:rotate(-45deg);-ms-transform:rotate(-45deg);transform:rotate(-45deg)}#philippines .sun .ray:nth-child(3){left:34px;top:-13px;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}#philippines .sun .ray:nth-child(4){left:-23px;top:10px;-webkit-transform:rotate(-90deg);-ms-transform:rotate(-90deg);transform:rotate(-90deg)}#philippines .sun .ray:nth-child(5){left:44px;top:10px;-webkit-transform:rotate(90deg);-ms-transform:rotate(90deg);transform:rotate(90deg)}#philippines .sun .ray:nth-child(6){left:-13px;top:34px;-webkit-transform:rotate(-135deg);-ms-transform:rotate(-135deg);transform:rotate(-135deg)}#philippines .sun .ray:nth-child(7){top:44px;left:10px;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}#philippines .sun .ray:nth-child(8){left:34px;top:34px;-webkit-transform:rotate(135deg);-ms-transform:rotate(135deg);transform:rotate(135deg)}#philippines .sun .ray{height:0;width:0;border-width:6px;border-style:solid;border-color:transparent transparent #FCD116 transparent;position:absolute}#philippines .sun .ray:before,#philippines .sun .ray:after{content:'';background-color:#FCD116;position:absolute;display:block;width:7px;height:13px;top:5px}#philippines .sun .ray:before{left:-2px;-webkit-transform:rotate(10deg);-ms-transform:rotate(10deg);transform:rotate(10deg)}#philippines .sun .ray:after{left:-5px;-webkit-transform:rotate(-10deg);-ms-transform:rotate(-10deg);transform:rotate(-10deg)}#philippines .sun .ray>i,#philippines .sun .ray>i:before{position:absolute;display:block;width:2px;height:17px;top:0;background:#fff}#philippines .sun .ray>i{left:-4px;-webkit-transform:rotate(-8deg);-ms-transform:rotate(-8deg);transform:rotate(-8deg);z-index:1}#philippines .sun .ray>i:before{content:'';left:6px;-webkit-transform:rotate(15deg);-ms-transform:rotate(15deg);transform:rotate(15deg);z-index:1} -------------------------------------------------------------------------------- /flags/css/republic-of-the-congo.css: -------------------------------------------------------------------------------- 1 | #republic-of-the-congo{background-image:-webkit-linear-gradient(135deg,#009543 40%,#fbde4a 40%,#fbde4a 60%,#dc241f 57%);background-image:-o-linear-gradient(135deg,#009543 40%,#fbde4a 40%,#fbde4a 60%,#dc241f 57%);background-image:-moz-linear-gradient(135deg,#009543 40%,#fbde4a 40%,#fbde4a 60%,#dc241f 57%);background-image:linear-gradient(135deg,#009543 40%,#fbde4a 40%,#fbde4a 60%,#dc241f 57%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/romania.css: -------------------------------------------------------------------------------- 1 | #romania{background-image:-webkit-linear-gradient(90deg,#002b7f 33%,#fcd116 33%,#fcd116 66%,#ce1126 66%);background-image:-o-linear-gradient(90deg,#002b7f 33%,#fcd116 33%,#fcd116 66%,#ce1126 66%);background-image:-moz-linear-gradient(90deg,#002b7f 33%,#fcd116 33%,#fcd116 66%,#ce1126 66%);background-image:linear-gradient(90deg,#002b7f 33%,#fcd116 33%,#fcd116 66%,#ce1126 66%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/rwanda.css: -------------------------------------------------------------------------------- 1 | #rwanda{position:relative;background-image:-webkit-linear-gradient(#00a1de 40%,#00a1de 56%,#fad201 56%,#fad201 80%,#20603d 80%);background-image:-o-linear-gradient(#00a1de 40%,#00a1de 56%,#fad201 56%,#fad201 80%,#20603d 80%);background-image:-moz-linear-gradient(#00a1de 40%,#00a1de 56%,#fad201 56%,#fad201 80%,#20603d 80%);background-image:linear-gradient(#00a1de 40%,#00a1de 56%,#fad201 56%,#fad201 80%,#20603d 80%);width:250px;height:167px}#rwanda .star{position:absolute;width:0;height:0;border-left:1px solid transparent;border-right:1px solid transparent;border-bottom:16px solid #e5be01}#rwanda .star1{top:18px;left:204px}#rwanda .star2{top:20px;left:208px;-webkit-transform:rotate(14deg);-ms-transform:rotate(14deg);transform:rotate(14deg)}#rwanda .star3{top:22px;left:212px;-webkit-transform:rotate(29deg);-ms-transform:rotate(29deg);transform:rotate(29deg)}#rwanda .star4{top:25px;left:215px;-webkit-transform:rotate(45deg);-ms-transform:rotate(45deg);transform:rotate(45deg)}#rwanda .star5{top:28px;left:217px;-webkit-transform:rotate(61deg);-ms-transform:rotate(61deg);transform:rotate(61deg)}#rwanda .star6{top:32px;left:217px;-webkit-transform:rotate(76deg);-ms-transform:rotate(76deg);transform:rotate(76deg)}#rwanda .star7{top:35px;left:217px;-webkit-transform:rotate(87deg);-ms-transform:rotate(87deg);transform:rotate(87deg)}#rwanda .star8{top:39px;left:217px;-webkit-transform:rotate(104deg);-ms-transform:rotate(104deg);transform:rotate(104deg)}#rwanda .star9{top:43px;left:217px;-webkit-transform:rotate(120deg);-ms-transform:rotate(120deg);transform:rotate(120deg)}#rwanda .star10{top:47px;left:216px;-webkit-transform:rotate(135deg);-ms-transform:rotate(135deg);transform:rotate(135deg)}#rwanda .star11{top:49px;left:212px;-webkit-transform:rotate(150deg);-ms-transform:rotate(150deg);transform:rotate(150deg)}#rwanda .star12{top:50px;left:208px;-webkit-transform:rotate(165deg);-ms-transform:rotate(165deg);transform:rotate(165deg)}#rwanda .star13{top:51px;left:204px;-webkit-transform:rotate(180deg);-ms-transform:rotate(180deg);transform:rotate(180deg)}#rwanda .star14{top:50px;left:200px;-webkit-transform:rotate(195deg);-ms-transform:rotate(195deg);transform:rotate(195deg)}#rwanda .star15{top:50px;left:196px;-webkit-transform:rotate(210deg);-ms-transform:rotate(210deg);transform:rotate(210deg)}#rwanda .star16{top:47px;left:193px;-webkit-transform:rotate(225deg);-ms-transform:rotate(225deg);transform:rotate(225deg)}#rwanda .star17{top:44px;left:190px;-webkit-transform:rotate(240deg);-ms-transform:rotate(240deg);transform:rotate(240deg)}#rwanda .star18{top:40px;left:189px;-webkit-transform:rotate(255deg);-ms-transform:rotate(255deg);transform:rotate(255deg)}#rwanda .star19{top:36px;left:188px;-webkit-transform:rotate(270deg);-ms-transform:rotate(270deg);transform:rotate(270deg)}#rwanda .star20{top:31px;left:188px;-webkit-transform:rotate(285deg);-ms-transform:rotate(285deg);transform:rotate(285deg)}#rwanda .star21{top:27px;left:190px;-webkit-transform:rotate(300deg);-ms-transform:rotate(300deg);transform:rotate(300deg)}#rwanda .star22{top:24px;left:193px;-webkit-transform:rotate(315deg);-ms-transform:rotate(315deg);transform:rotate(315deg)}#rwanda .star23{top:21px;left:196px;-webkit-transform:rotate(330deg);-ms-transform:rotate(330deg);transform:rotate(330deg)}#rwanda .star24{top:20px;left:200px;-webkit-transform:rotate(345deg);-ms-transform:rotate(345deg);transform:rotate(345deg)}#rwanda .star-outer{top:34px;left:196px;width:19px;height:19px;background:#e5be01;border-radius:50%}#rwanda .star-middle{top:1px;left:1px;width:17px;height:17px;background:#00a1de;border-radius:50%}#rwanda .star-inner{top:1px;left:1px;width:15px;height:15px;background:#e5be01;border-radius:50%} -------------------------------------------------------------------------------- /flags/css/south-korea.css: -------------------------------------------------------------------------------- 1 | #south-korea{position:relative;background:#fff;width:225px;height:150px}#south-korea .yinyang{position:relative;top:37px;left:74px;width:76px;height:41px;background:#c60c30;border-bottom:35px solid #003478;border-radius:50%}#south-korea .yinyang:before{content:"";position:absolute;top:50%;left:0;width:39px;height:30px;background:#c60c30;border-radius:50%}#south-korea .yinyang.yinyang:after{content:"";position:absolute;top:66%;left:50%;width:38px;height:30px;background:#003478;border-radius:50%}#south-korea .stripes{height:25px;width:39px}#south-korea .stripes.stripes1{top:24px;left:36px;background-image:linear-gradient(#000 22%,#fff 22%,#fff 39%,#000 39%,#000 61%,#fff 61%,#fff 78%,#000 78%);transform:rotate(-56deg)}#south-korea .stripes.stripes2{top:24px;left:150px;background-image:linear-gradient(#fff 25%,transparent 25%,transparent 75%,#fff 75%),linear-gradient(#000 22%,#fff 22%,#fff 39%,#000 39%,#000 61%,#fff 61%,#fff 78%,#000 78%);background-size:16% 100%;background-position:50% 0,0 0;background-repeat:no-repeat,repeat;transform:rotate(56deg)}#south-korea .stripes.stripes3{top:101px;left:36px;background-image:linear-gradient(90deg,transparent 43%,#fff 43%,#fff 57%,transparent 57%),linear-gradient(#000 22%,#fff 22%,#fff 39%,#000 39%,#000 61%,#fff 61%,#fff 78%,#000 78%);background-size:39px 11px,39px 25px;background-position:0 7px,0 0;background-repeat:no-repeat,repeat;transform:rotate(56deg)}#south-korea .stripes.stripes4{top:101px;left:150px;background-image:linear-gradient(90deg,transparent 43%,#fff 43%,#fff 57%,transparent 57%),linear-gradient(#000 22%,#fff 22%,#fff 39%,#000 39%,#000 61%,#fff 61%,#fff 78%,#000 78%);transform:rotate(-56deg)} -------------------------------------------------------------------------------- /flags/css/styles.css: -------------------------------------------------------------------------------- 1 | html,body{height:100%}#wrap{min-height:100%;height:auto!important;height:100%;margin:0 auto -60px}#push,#footer{height:60px}#footer{background-color:#f5f5f5}@media (max-width:767px){#footer{margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px}} -------------------------------------------------------------------------------- /flags/css/tanzania.css: -------------------------------------------------------------------------------- 1 | #tanzania{background-image:-webkit-linear-gradient(147deg,#1eb53a 39%,#fcd116 39%,#fcd116 43%,#000 43%,#000 57%,#fcd116 57%,#fcd116 61%,#00a3dd 61%);background-image:-o-linear-gradient(147deg,#1eb53a 39%,#fcd116 39%,#fcd116 43%,#000 43%,#000 57%,#fcd116 57%,#fcd116 61%,#00a3dd 61%);background-image:-moz-linear-gradient(147deg,#1eb53a 39%,#fcd116 39%,#fcd116 43%,#000 43%,#000 57%,#fcd116 57%,#fcd116 61%,#00a3dd 61%);background-image:linear-gradient(147deg,#1eb53a 39%,#fcd116 39%,#fcd116 43%,#000 43%,#000 57%,#fcd116 57%,#fcd116 61%,#00a3dd 61%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/css/tunisia.css: -------------------------------------------------------------------------------- 1 | #tunisia{position:relative;background:#e70013;width:225px;height:150px}#tunisia .middle{display:block;width:73px;top:38px;left:76px;height:73px;background:#fff;border-radius:50%}#tunisia .moon{display:block;width:55px;top:9px;left:9px;height:55px;background:#e70013;border-radius:50%}#tunisia .moon-clip{display:block;width:45px;top:14px;left:22px;height:45px;background:#fff;border-radius:50%} -------------------------------------------------------------------------------- /flags/css/united-kingdom.css: -------------------------------------------------------------------------------- 1 | #united-kingdom{background-color:#00247d;background-image:linear-gradient(#cf142b 30px,transparent 30px),linear-gradient(90deg,#cf142b 30px,transparent 30px),linear-gradient(#fff 50px,transparent 50px),linear-gradient(90deg,#fff 50px,transparent 50px),linear-gradient(25deg,transparent 35px,#cf142b 35px,#cf142b 45px,transparent 45px),linear-gradient(25deg,transparent 30px,#fff 30px,#fff 55px,transparent 55px),linear-gradient(-25deg,transparent 45px,#cf142b 45px,#cf142b 55px,transparent 55px),linear-gradient(-25deg,transparent 35px,#fff 35px,#fff 60px,transparent 60px),linear-gradient(-25deg,transparent 45px,#cf142b 45px,#cf142b 55px,transparent 55px),linear-gradient(-25deg,transparent 40px,#fff 40px,#fff 65px,transparent 65px),linear-gradient(25deg,transparent 55px,#cf142b 55px,#cf142b 65px,transparent 65px),linear-gradient(25deg,transparent 45px,#fff 45px,#fff 70px,transparent 70px);background-size:300px 90px,165px 150px,300px 100px,175px 150px,125px 50px,125px 50px,125px 50px,125px 50px,125px 50px,125px 50px,125px 50px,125px 50px;background-position:0 -30px,-30px 0,0 -50px,-50px 0,0 0,0 0,175px 0,175px 0,0 100px,0 100px,175px 100px,175px 100px;background-repeat:repeat,repeat,repeat,repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat,no-repeat;width:300px;height:150px} -------------------------------------------------------------------------------- /flags/css/usa.css: -------------------------------------------------------------------------------- 1 | #usa{position:relative;background-image:-webkit-linear-gradient(90deg,#3c3b6e 40%,transparent 40%),linear-gradient(#b22234 50%,#fff 50%);background-image:-o-linear-gradient(90deg,#3c3b6e 40%,transparent 40%),linear-gradient(#b22234 50%,#fff 50%);background-image:-moz-linear-gradient(90deg,#3c3b6e 40%,transparent 40%),linear-gradient(#b22234 50%,#fff 50%);background-image:linear-gradient(90deg,#3c3b6e 40%,transparent 40%),linear-gradient(#b22234 50%,#fff 50%);background-size:300px 84px,300px 24px;background-repeat:no-repeat,repeat-y;width:300px;height:158px}#usa star{display:block;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-moz-transform:rotate(35deg) scale(0.08,.08);-webkit-transform:rotate(35deg) scale(0.08,.08);-ms-transform:rotate(35deg) scale(0.08,.08);-o-transform:rotate(35deg) scale(0.08,.08)}#usa star:before{content:'';display:block;position:absolute;top:-22.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #fff;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#usa star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #fff;border-left:50px solid transparent;-webkit-transform:rotate(-70deg);-moz-transform:rotate(-70deg);-ms-transform:rotate(-70deg);-o-transform:rotate(-70deg)}#usa .star1{top:-9px;left:-40px}#usa .star2{top:-9px;left:-20px}#usa .star3{top:-9px;left:0}#usa .star4{top:-9px;left:20px}#usa .star5{top:-9px;left:40px}#usa .star6{top:-9px;left:60px}#usa .star7{top:-1px;left:-30px}#usa .star8{top:-1px;left:-10px}#usa .star9{top:-1px;left:10px}#usa .star10{top:-1px;left:30px}#usa .star11{top:-1px;left:50px}#usa .star12{top:8px;left:-40px}#usa .star13{top:8px;left:-20px}#usa .star14{top:8px;left:0}#usa .star15{top:8px;left:20px}#usa .star16{top:8px;left:40px}#usa .star17{top:8px;left:60px}#usa .star18{top:16px;left:-30px}#usa .star19{top:16px;left:-10px}#usa .star20{top:16px;left:10px}#usa .star21{top:16px;left:30px}#usa .star22{top:16px;left:50px}#usa .star23{top:25px;left:-40px}#usa .star24{top:25px;left:-20px}#usa .star25{top:25px;left:0}#usa .star26{top:25px;left:20px}#usa .star27{top:25px;left:40px}#usa .star28{top:25px;left:60px}#usa .star29{top:34px;left:-30px}#usa .star30{top:34px;left:-10px}#usa .star31{top:34px;left:10px}#usa .star32{top:34px;left:30px}#usa .star33{top:34px;left:50px}#usa .star34{top:42px;left:-40px}#usa .star35{top:42px;left:-20px}#usa .star36{top:42px;left:0}#usa .star37{top:42px;left:20px}#usa .star38{top:42px;left:40px}#usa .star39{top:42px;left:60px}#usa .star40{top:51px;left:-30px}#usa .star41{top:51px;left:-10px}#usa .star42{top:51px;left:10px}#usa .star43{top:51px;left:30px}#usa .star44{top:51px;left:50px}#usa .star45{top:59px;left:-40px}#usa .star46{top:59px;left:-20px}#usa .star47{top:59px;left:0}#usa .star48{top:59px;left:20px}#usa .star49{top:59px;left:40px}#usa .star50{top:59px;left:60px} -------------------------------------------------------------------------------- /flags/css/vietnam.css: -------------------------------------------------------------------------------- 1 | #vietnam{position:relative;background-color:#da251d;width:225px;height:150px}#vietnam .star{display:block;position:absolute;top:56px;left:64px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #ff0;border-left:50px solid transparent;-moz-transform:rotate(36deg) scale(0.9,.9);-webkit-transform:rotate(36deg) scale(0.9,.9);-ms-transform:rotate(36deg) scale(0.9,.9);-o-transform:rotate(36deg) scale(0.9,.9)}#vietnam .star:before{content:'';display:block;position:absolute;top:-23.5px;left:-32.5px;height:0;width:0;border-bottom:40px solid #ff0;border-left:15px solid transparent;border-right:15px solid transparent;-webkit-transform:rotate(-35deg);-moz-transform:rotate(-35deg);-ms-transform:rotate(-35deg);-o-transform:rotate(-35deg)}#vietnam .star:after{content:'';display:block;position:absolute;top:3px;left:-52.5px;width:0;height:0;border-right:50px solid transparent;border-bottom:35px solid #ff0;border-left:50px solid transparent;-webkit-transform:rotate(-72deg);-moz-transform:rotate(-72deg);-ms-transform:rotate(-72deg);-o-transform:rotate(-72deg)} -------------------------------------------------------------------------------- /flags/css/yemen.css: -------------------------------------------------------------------------------- 1 | #yemen{background-image:-webkit-linear-gradient(#ce1126 33%,#fff 33%,#fff 66%,#000 66%);background-image:-moz-linear-gradient(#ce1126 33%,#fff 33%,#fff 66%,#000 66%);background-image:-o-linear-gradient(#ce1126 33%,#fff 33%,#fff 66%,#000 66%);background-image:linear-gradient(#ce1126 33%,#fff 33%,#fff 66%,#000 66%);width:225px;height:150px} -------------------------------------------------------------------------------- /flags/cuba.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Cuba 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 | 23 | 24 | -------------------------------------------------------------------------------- /flags/czech-republic.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Czech Republic 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/djbouti.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Djbouti 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/dominican-republic.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Dominican Republic 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | -------------------------------------------------------------------------------- /flags/drc.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Democratic Republic of the Congo 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/east-timor.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | East Timor 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/estonia.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Estonia 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/finland.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Finland 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/france.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | France 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/gabon.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Gabon 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/gambia.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Gambia 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/germany.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Germany 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/greece.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Greece 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/iceland.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Iceland 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/ireland.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Ireland 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 |
18 | 19 | 20 | -------------------------------------------------------------------------------- /flags/japan.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Japan 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/kenya.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Kenya 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 |
26 |
27 |
28 |
29 |
30 | 31 | 32 | -------------------------------------------------------------------------------- /flags/less/algeria.less: -------------------------------------------------------------------------------- 1 | #algeria { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(90deg, #006233 50%, #ffffff 50%); 4 | background-image: -o-linear-gradient(90deg, #006233 50%, #ffffff 50%); 5 | background-image: -moz-linear-gradient(90deg, #006233 50%, #ffffff 50%); 6 | background-image: linear-gradient(90deg, #006233 50%, #ffffff 50%); 7 | width: 225px; 8 | height: 150px; 9 | 10 | .middle { 11 | display: block; 12 | width: 75px; 13 | top: 37px; 14 | left: 75px; 15 | height: 75px; 16 | background: #ffffff; 17 | border-radius: 50%; 18 | } 19 | 20 | .moon { 21 | display: block; 22 | width: 75px; 23 | top: 0px; 24 | left: 0px; 25 | height: 75px; 26 | background: #e70013; 27 | border-radius: 50%; 28 | } 29 | 30 | .moon-clip { 31 | display: block; 32 | width: 59px; 33 | top: 8px; 34 | left: 17px; 35 | height: 59px; 36 | background-image: -webkit-linear-gradient(90deg, #006233 35%, #ffffff 35%); 37 | background-image: -o-linear-gradient(90deg, #006233 35%, #ffffff 35%); 38 | background-image: -moz-linear-gradient(90deg, #006233 35%, #ffffff 35%); 39 | background-image: linear-gradient(90deg, #006233 35%, #ffffff 35%); 40 | border-radius: 50%; 41 | } 42 | 43 | 44 | .star { 45 | margin: 25px 0; 46 | position: absolute; 47 | top: -5px; 48 | left: 4px; 49 | display: block; 50 | color: red; 51 | width: 0px; 52 | height: 0px; 53 | border-right: 50px solid transparent; 54 | border-bottom: 35px solid #d21034; 55 | border-left: 50px solid transparent; 56 | -moz-transform: rotate(65deg) scale(0.35, 0.35); 57 | -webkit-transform: rotate(55deg) scale(0.35, 0.35); 58 | -ms-transform: rotate(65deg) scale(0.35, 0.35); 59 | -o-transform: rotate(65deg) scale(0.35, 0.35); 60 | 61 | &:before { 62 | content: ''; 63 | display: block; 64 | position: absolute; 65 | top: -22.5px; 66 | left: -32.5px; 67 | height: 0; 68 | width: 0; 69 | border-bottom: 40px solid #d21034; 70 | border-left: 15px solid transparent; 71 | border-right: 15px solid transparent; 72 | -webkit-transform: rotate(-35deg); 73 | -moz-transform: rotate(-35deg); 74 | -ms-transform: rotate(-35deg); 75 | -o-transform: rotate(-35deg); 76 | } 77 | 78 | &:after { 79 | content: ''; 80 | display: block; 81 | position: absolute; 82 | top: 3px; 83 | left: -52.5px; 84 | width: 0px; 85 | height: 0px; 86 | color: red; 87 | border-right: 50px solid transparent; 88 | border-bottom: 35px solid #d21034; 89 | border-left: 50px solid transparent; 90 | -webkit-transform: rotate(-70deg); 91 | -moz-transform: rotate(-70deg); 92 | -ms-transform: rotate(-70deg); 93 | -o-transform: rotate(-70deg); 94 | } 95 | } 96 | } -------------------------------------------------------------------------------- /flags/less/armenia.less: -------------------------------------------------------------------------------- 1 | #armenia { 2 | background-image: -webkit-linear-gradient(#d90012 33%, #0033a0 33%, #0033a0 66%, #f2a800 66%); 3 | background-image: -o-linear-gradient(#d90012 33%, #0033a0 33%, #0033a0 66%, #f2a800 66%); 4 | background-image: -moz-linear-gradient(#d90012 33%, #0033a0 33%, #0033a0 66%, #f2a800 66%); 5 | background-image: linear-gradient(#d90012 33%, #0033a0 33%, #0033a0 66%, #f2a800 66%); 6 | width: 300px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/austria.less: -------------------------------------------------------------------------------- 1 | #austria { 2 | background-image: -webkit-linear-gradient(#ed2939 33%, #ffffff 33%, #ffffff 66%, #ed2939 66%); 3 | background-image: -o-linear-gradient(#ed2939 33%, #ffffff 33%, #ffffff 66%, #ed2939 66%); 4 | background-image: -moz-linear-gradient(#ed2939 33%, #ffffff 33%, #ffffff 66%, #ed2939 66%); 5 | background-image: linear-gradient(#ed2939 33%, #ffffff 33%, #ffffff 66%, #ed2939 66%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/azerbaijan.less: -------------------------------------------------------------------------------- 1 | #azerbaijan { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(#0098c3 33%, #e00034 33%, #e00034 66%, #00ae65 66%); 4 | background-image: -o-linear-gradient(#0098c3 33%, #e00034 33%, #e00034 66%, #00ae65 66%); 5 | background-image: -moz-linear-gradient(#0098c3 33%, #e00034 33%, #e00034 66%, #00ae65 66%); 6 | background-image: linear-gradient(#0098c3 33%, #e00034 33%, #e00034 66%, #00ae65 66%); 7 | width: 300px; 8 | height: 150px; 9 | 10 | .moon { 11 | display: block; 12 | width: 45px; 13 | top: 52px; 14 | left: 123px; 15 | height: 45px; 16 | background: #ffffff; 17 | border-radius: 50%; 18 | -webkit-border-radius: 50%; 19 | -moz-border-radius: 50%; 20 | } 21 | 22 | .moon-clip { 23 | display: block; 24 | position: absolute; 25 | top: 4px; 26 | left: 8px; 27 | width: 38px; 28 | height: 38px; 29 | background: #e00034; 30 | border-radius: 50%; 31 | -webkit-border-radius: 50%; 32 | -moz-border-radius: 50%; 33 | } 34 | 35 | .star { 36 | display: block; 37 | position: absolute; 38 | top: 19px; 39 | left: 36px; 40 | width: 0px; 41 | height: 0px; 42 | border-right: 11px solid transparent; 43 | border-bottom: 7px solid #ffffff; 44 | border-left: 11px solid transparent; 45 | -moz-transform: rotate(112deg); 46 | -webkit-transform: rotate(112deg); 47 | -ms-transform: rotate(112deg); 48 | -o-transform: rotate(112deg); 49 | } 50 | 51 | .star2 { 52 | display: block; 53 | position: absolute; 54 | top: 20px; 55 | left: 36px; 56 | width: 0px; 57 | height: 0px; 58 | border-right: 11px solid transparent; 59 | border-bottom: 7px solid #ffffff; 60 | border-left: 11px solid transparent; 61 | -moz-transform: rotate(24deg); 62 | -webkit-transform: rotate(24deg); 63 | -ms-transform: rotate(24deg); 64 | -o-transform: rotate(24deg); 65 | } 66 | 67 | .star3 { 68 | display: block; 69 | position: absolute; 70 | top: 20px; 71 | left: 37px; 72 | width: 0px; 73 | height: 0px; 74 | border-right: 11px solid transparent; 75 | border-bottom: 7px solid #ffffff; 76 | border-left: 11px solid transparent; 77 | -moz-transform: rotate(24deg); 78 | -webkit-transform: rotate(-67deg); 79 | -ms-transform: rotate(24deg); 80 | -o-transform: rotate(24deg); 81 | } 82 | 83 | .star4 { 84 | display: block; 85 | position: absolute; 86 | top: 19px; 87 | left: 36px; 88 | width: 0px; 89 | height: 0px; 90 | border-right: 11px solid transparent; 91 | border-bottom: 7px solid #ffffff; 92 | border-left: 11px solid transparent; 93 | -moz-transform: rotate(-157deg); 94 | -webkit-transform: rotate(-157deg); 95 | -ms-transform: rotate(-157deg); 96 | -o-transform: rotate(-157deg); 97 | } 98 | } -------------------------------------------------------------------------------- /flags/less/bahamas.less: -------------------------------------------------------------------------------- 1 | #bahamas { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(#00abc9 33%, #fae042 33%, #fae042 66%, #00abc9 66%); 4 | background-image: -o-linear-gradient(#00abc9 33%, #fae042 33%, #fae042 66%, #00abc9 66%); 5 | background-image: -moz-linear-gradient(#00abc9 33%, #fae042 33%, #fae042 66%, #00abc9 66%); 6 | background-image: linear-gradient(#00abc9 33%, #fae042 33%, #fae042 66%, #00abc9 66%); 7 | width: 300px; 8 | height: 150px; 9 | 10 | .triangle { 11 | top: 0px; 12 | left: 0px; 13 | width: 0; 14 | height: 0; 15 | border-top: 75px solid transparent; 16 | border-bottom: 75px solid transparent; 17 | border-left: 100px solid #000000; 18 | } 19 | } -------------------------------------------------------------------------------- /flags/less/bangladesh.less: -------------------------------------------------------------------------------- 1 | #bangladesh { 2 | position: relative; 3 | background: #006a4e; 4 | width: 250px; 5 | height: 150px; 6 | 7 | .middle { 8 | display: block; 9 | width: 100px; 10 | top: 25px; 11 | left: 62px; 12 | height: 100px; 13 | background: #f42a41; 14 | border-radius: 50%; 15 | -webkit-border-radius: 50%; 16 | -moz-border-radius: 50%; 17 | } 18 | } -------------------------------------------------------------------------------- /flags/less/belgium.less: -------------------------------------------------------------------------------- 1 | #belgium { 2 | background-image: -webkit-linear-gradient(90deg, #000000 33%, #fae042 33%, #fae042 66%, #ed2939 66%); 3 | background-image: -o-linear-gradient(90deg, #000000 33%, #fae042 33%, #fae042 66%, #ed2939 66%); 4 | background-image: -moz-linear-gradient(90deg, #000000 33%, #fae042 33%, #fae042 66%, #ed2939 66%); 5 | background-image: linear-gradient(90deg, #000000 33%, #fae042 33%, #fae042 66%, #ed2939 66%); 6 | width: 173px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/benin.less: -------------------------------------------------------------------------------- 1 | #benin { 2 | background-image: -webkit-linear-gradient(90deg, #008751 40%, transparent 40%), linear-gradient(#fcd116 50%, #e8112d 50%); 3 | background-image: -o-linear-gradient(90deg, #008751 40%, transparent 40%), linear-gradient(#fcd116 50%, #e8112d 50%); 4 | background-image: -moz-linear-gradient(90deg, #008751 40%, transparent 40%), linear-gradient(#fcd116 50%, #e8112d 50%); 5 | background-image: linear-gradient(90deg, #008751 40%, transparent 40%), linear-gradient(#fcd116 50%, #e8112d 50%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/botswana.less: -------------------------------------------------------------------------------- 1 | #botswana { 2 | background-image: -webkit-linear-gradient(#75aadb 37%, #ffffff 37%, #ffffff 41%, #000000 41%, #000000 59%, #ffffff 59%, #ffffff 63%, #75aadb 63%); 3 | background-image: -o-linear-gradient(#75aadb 37%, #ffffff 37%, #ffffff 41%, #000000 41%, #000000 59%, #ffffff 59%, #ffffff 63%, #75aadb 63%); 4 | background-image: -moz-linear-gradient(#75aadb 37%, #ffffff 37%, #ffffff 41%, #000000 41%, #000000 59%, #ffffff 59%, #ffffff 63%, #75aadb 63%); 5 | background-image: linear-gradient(#75aadb 37%, #ffffff 37%, #ffffff 41%, #000000 41%, #000000 59%, #ffffff 59%, #ffffff 63%, #75aadb 63%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/brazil.less: -------------------------------------------------------------------------------- 1 | @color-white: #fff; 2 | @color-flag: #16b83e; 3 | @color-losangue: #ffe11f; 4 | @color-circle: #1651b8; 5 | 6 | #brazil { 7 | position: relative; 8 | background-color: @color-flag; 9 | width: 250px; 10 | height: 150px; 11 | 12 | .circle, 13 | .losangue:before, 14 | .losangue:after { 15 | position: absolute; 16 | } 17 | 18 | .losangue { 19 | width: 100%; 20 | height: 100%; 21 | top: 0; 22 | bottom: 0; 23 | left: 0; 24 | right: 0; 25 | 26 | &:before, 27 | &:after { 28 | content: ''; 29 | width: 0; 30 | height: 0; 31 | left: 20px; 32 | right: 20px; 33 | } 34 | 35 | &:before { 36 | border-left: 105px solid transparent; 37 | border-right: 105px solid transparent; 38 | border-bottom: 65px solid @color-losangue; 39 | top: 10px; 40 | } 41 | 42 | &:after { 43 | border-left: 105px solid transparent; 44 | border-right: 105px solid transparent; 45 | border-top: 65px solid @color-losangue; 46 | bottom: 10px; 47 | } 48 | } 49 | 50 | .circle { 51 | overflow: hidden; 52 | z-index: 2; 53 | display: block; 54 | background-color: @color-circle; 55 | height: 80px; 56 | width: 80px; 57 | margin-top: -40px; 58 | margin-left: -40px; 59 | 60 | &, 61 | &:before, 62 | &:after { 63 | top: 50%; 64 | left: 50%; 65 | position: absolute; 66 | border-radius: 50%; 67 | -webkit-border-radius: 50%; 68 | -moz-border-radius: 50%; 69 | } 70 | 71 | &:before, 72 | &:after { 73 | width: 90px; 74 | height: 40px; 75 | -ms-transform: rotate(14deg); 76 | -webkit-transform: rotate(14deg); 77 | transform: rotate(14deg); 78 | } 79 | 80 | &:before { 81 | z-index: 3; 82 | content: ''; 83 | margin-top: -20px; 84 | margin-left: -45px; 85 | background: @color-white; 86 | } 87 | 88 | &:after { 89 | z-index: 4; 90 | content: ''; 91 | margin-top: -10px; 92 | margin-left: -48px; 93 | background-color: @color-circle; 94 | } 95 | } 96 | } -------------------------------------------------------------------------------- /flags/less/bulgaria.less: -------------------------------------------------------------------------------- 1 | #bulgaria { 2 | background-image: -webkit-linear-gradient(#ffffff 33%, #00966e 33%, #00966e 66%, #d62612 66%); 3 | background-image: -o-linear-gradient(#ffffff 33%, #00966e 33%, #00966e 66%, #d62612 66%); 4 | background-image: -moz-linear-gradient(#ffffff 33%, #00966e 33%, #00966e 66%, #d62612 66%); 5 | background-image: linear-gradient(#ffffff 33%, #00966e 33%, #00966e 66%, #d62612 66%); 6 | width: 250px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/burkina-faso.less: -------------------------------------------------------------------------------- 1 | #burkina-faso { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(#ef2b2d 50%, #009e49 50%); 4 | background-image: -o-linear-gradient(#ef2b2d 50%, #009e49 50%); 5 | background-image: -moz-linear-gradient(#ef2b2d 50%, #009e49 50%); 6 | background-image: linear-gradient(#ef2b2d 50%, #009e49 50%); 7 | width: 225px; 8 | height: 150px; 9 | 10 | .star { 11 | display: block; 12 | top: 57px; 13 | left: 63px; 14 | width: 0px; 15 | height: 0px; 16 | border-right: 50px solid transparent; 17 | border-bottom: 35px solid #fcd116; 18 | border-left: 50px solid transparent; 19 | -moz-transform: rotate(35deg) scale(0.46, 0.46); 20 | -webkit-transform: rotate(35deg) scale(0.46, 0.46); 21 | -ms-transform: rotate(35deg) scale(0.46, 0.46); 22 | -o-transform: rotate(35deg) scale(0.46, 0.46); 23 | 24 | &:before { 25 | content: ''; 26 | display: block; 27 | position: absolute; 28 | top: -22.5px; 29 | left: -32.5px; 30 | height: 0; 31 | width: 0; 32 | border-bottom: 40px solid #fcd116; 33 | border-left: 15px solid transparent; 34 | border-right: 15px solid transparent; 35 | -webkit-transform: rotate(-35deg); 36 | -moz-transform: rotate(-35deg); 37 | -ms-transform: rotate(-35deg); 38 | -o-transform: rotate(-35deg); 39 | } 40 | 41 | &:after { 42 | content: ''; 43 | display: block; 44 | position: absolute; 45 | top: 3px; 46 | left: -52.5px; 47 | width: 0px; 48 | height: 0px; 49 | border-right: 50px solid transparent; 50 | border-bottom: 35px solid #fcd116; 51 | border-left: 50px solid transparent; 52 | -webkit-transform: rotate(-70deg); 53 | -moz-transform: rotate(-70deg); 54 | -ms-transform: rotate(-70deg); 55 | -o-transform: rotate(-70deg); 56 | } 57 | } 58 | } -------------------------------------------------------------------------------- /flags/less/cameroon.less: -------------------------------------------------------------------------------- 1 | #cameroon { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(90deg, #007a5e 33%, #ce1126 33%, #ce1126 66%, #fcd116 66%); 4 | background-image: -o-linear-gradient(90deg, #007a5e 33%, #ce1126 33%, #ce1126 66%, #fcd116 66%); 5 | background-image: -moz-linear-gradient(90deg, #007a5e 33%, #ce1126 33%, #ce1126 66%, #fcd116 66%); 6 | background-image: linear-gradient(90deg, #007a5e 33%, #ce1126 33%, #ce1126 66%, #fcd116 66%); 7 | width: 225px; 8 | height: 150px; 9 | 10 | .star { 11 | display: block; 12 | top: 57px; 13 | left: 63px; 14 | width: 0px; 15 | height: 0px; 16 | border-right: 50px solid transparent; 17 | border-bottom: 35px solid #fcd116; 18 | border-left: 50px solid transparent; 19 | -moz-transform: rotate(35deg) scale(0.46, 0.46); 20 | -webkit-transform: rotate(35deg) scale(0.46, 0.46); 21 | -ms-transform: rotate(35deg) scale(0.46, 0.46); 22 | -o-transform: rotate(35deg) scale(0.46, 0.46); 23 | 24 | &:before { 25 | content: ''; 26 | display: block; 27 | position: absolute; 28 | top: -22.5px; 29 | left: -32.5px; 30 | height: 0; 31 | width: 0; 32 | border-bottom: 40px solid #fcd116; 33 | border-left: 15px solid transparent; 34 | border-right: 15px solid transparent; 35 | -webkit-transform: rotate(-35deg); 36 | -moz-transform: rotate(-35deg); 37 | -ms-transform: rotate(-35deg); 38 | -o-transform: rotate(-35deg); 39 | } 40 | 41 | &:after { 42 | content: ''; 43 | display: block; 44 | position: absolute; 45 | top: 3px; 46 | left: -52.5px; 47 | width: 0px; 48 | height: 0px; 49 | border-right: 50px solid transparent; 50 | border-bottom: 35px solid #fcd116; 51 | border-left: 50px solid transparent; 52 | -webkit-transform: rotate(-70deg); 53 | -moz-transform: rotate(-70deg); 54 | -ms-transform: rotate(-70deg); 55 | -o-transform: rotate(-70deg); 56 | } 57 | } 58 | } -------------------------------------------------------------------------------- /flags/less/chad.less: -------------------------------------------------------------------------------- 1 | #chad { 2 | background-image: -webkit-linear-gradient(90deg, #002664 33%, #fecb00 33%, #fecb00 66%, #c60c30 66%); 3 | background-image: -o-linear-gradient(90deg, #002664 33%, #fecb00 33%, #fecb00 66%, #c60c30 66%); 4 | background-image: -moz-linear-gradient(90deg, #002664 33%, #fecb00 33%, #fecb00 66%, #c60c30 66%); 5 | background-image: linear-gradient(90deg, #002664 33%, #fecb00 33%, #fecb00 66%, #c60c30 66%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/chile.less: -------------------------------------------------------------------------------- 1 | #chile { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(90deg, #0039a6 75px, transparent 75px), linear-gradient(#ffffff 50%, #d52b1e 50%); 4 | background-image: -o-linear-gradient(90deg, #0039a6 75px, transparent 75px), linear-gradient(#ffffff 50%, #d52b1e 50%); 5 | background-image: -moz-linear-gradient(90deg, #0039a6 75px, transparent 75px), linear-gradient(#ffffff 50%, #d52b1e 50%); 6 | background-image: linear-gradient(90deg, #0039a6 75px, transparent 75px), linear-gradient(#ffffff 50%, #d52b1e 50%); 7 | background-size: 225px 75px, 225px 150px; 8 | background-repeat: no-repeat, no-repeat; 9 | width: 225px; 10 | height: 150px; 11 | 12 | .star { 13 | display: block; 14 | position: absolute; 15 | top: 19px; 16 | left: -12px; 17 | width: 0px; 18 | height: 0px; 19 | border-right: 50px solid transparent; 20 | border-bottom: 35px solid #ffffff; 21 | border-left: 50px solid transparent; 22 | -moz-transform: rotate(35deg) scale(0.35, 0.35); 23 | -webkit-transform: rotate(35deg) scale(0.35, 0.35); 24 | -ms-transform: rotate(35deg) scale(0.35, 0.35); 25 | -o-transform: rotate(35deg) scale(0.35, 0.35); 26 | 27 | &:before { 28 | content: ''; 29 | display: block; 30 | position: absolute; 31 | top: -22.5px; 32 | left: -32.5px; 33 | height: 0; 34 | width: 0; 35 | border-bottom: 40px solid #ffffff; 36 | border-left: 15px solid transparent; 37 | border-right: 15px solid transparent; 38 | -webkit-transform: rotate(-35deg); 39 | -moz-transform: rotate(-35deg); 40 | -ms-transform: rotate(-35deg); 41 | -o-transform: rotate(-35deg); 42 | } 43 | 44 | &:after { 45 | content: ''; 46 | display: block; 47 | position: absolute; 48 | top: 3px; 49 | left: -52.5px; 50 | width: 0px; 51 | height: 0px; 52 | border-right: 50px solid transparent; 53 | border-bottom: 35px solid #ffffff; 54 | border-left: 50px solid transparent; 55 | -webkit-transform: rotate(-70deg); 56 | -moz-transform: rotate(-70deg); 57 | -ms-transform: rotate(-70deg); 58 | -o-transform: rotate(-70deg); 59 | } 60 | } 61 | } -------------------------------------------------------------------------------- /flags/less/china.less: -------------------------------------------------------------------------------- 1 | #china { 2 | position: relative; 3 | background: #de2910; 4 | width: 225px; 5 | height: 150px; 6 | 7 | .star { 8 | display: block; 9 | position: absolute; 10 | top: 19px; 11 | left: -12px; 12 | width: 0px; 13 | height: 0px; 14 | border-right: 50px solid transparent; 15 | border-bottom: 35px solid #ffde00; 16 | border-left: 50px solid transparent; 17 | -moz-transform: rotate(35deg) scale(0.45, 0.45); 18 | -webkit-transform: rotate(35deg) scale(0.45, 0.45); 19 | -ms-transform: rotate(35deg) scale(0.45, 0.45); 20 | -o-transform: rotate(35deg) scale(0.45, 0.45); 21 | 22 | &:before { 23 | content: ''; 24 | display: block; 25 | position: absolute; 26 | top: -22.5px; 27 | left: -32.5px; 28 | height: 0; 29 | width: 0; 30 | border-bottom: 40px solid #ffde00; 31 | border-left: 15px solid transparent; 32 | border-right: 15px solid transparent; 33 | -webkit-transform: rotate(-35deg); 34 | -moz-transform: rotate(-35deg); 35 | -ms-transform: rotate(-35deg); 36 | -o-transform: rotate(-35deg); 37 | } 38 | 39 | &:after { 40 | content: ''; 41 | display: block; 42 | position: absolute; 43 | top: 3px; 44 | left: -52.5px; 45 | width: 0px; 46 | height: 0px; 47 | border-right: 50px solid transparent; 48 | border-bottom: 35px solid #ffde00; 49 | border-left: 50px solid transparent; 50 | -webkit-transform: rotate(-70deg); 51 | -moz-transform: rotate(-70deg); 52 | -ms-transform: rotate(-70deg); 53 | -o-transform: rotate(-70deg); 54 | } 55 | } 56 | 57 | .star-main { 58 | top: 19px; 59 | left: -12px; 60 | -moz-transform: rotate(35deg) scale(0.45, 0.45); 61 | -webkit-transform: rotate(35deg) scale(0.45, 0.45); 62 | -ms-transform: rotate(35deg) scale(0.45, 0.45); 63 | -o-transform: rotate(35deg) scale(0.45, 0.45); 64 | } 65 | 66 | .star-sub1 { 67 | top: -3px; 68 | left: 25px; 69 | -moz-transform: rotate(55deg) scale(0.12, 0.12); 70 | -webkit-transform: rotate(55deg) scale(0.12, 0.12); 71 | -ms-transform: rotate(55deg) scale(0.12, 0.12); 72 | -o-transform: rotate(55deg) scale(0.12, 0.12); 73 | } 74 | 75 | .star-sub2 { 76 | top: 12px; 77 | left: 40px; 78 | -moz-transform: rotate(10deg) scale(0.12, 0.12); 79 | -webkit-transform: rotate(10deg) scale(0.12, 0.12); 80 | -ms-transform: rotate(10deg) scale(0.12, 0.12); 81 | -o-transform: rotate(10deg) scale(0.12, 0.12); 82 | } 83 | 84 | .star-sub3 { 85 | top: 35px; 86 | left: 40px; 87 | -moz-transform: rotate(33deg) scale(0.12, 0.12); 88 | -webkit-transform: rotate(33deg) scale(0.12, 0.12); 89 | -ms-transform: rotate(33deg) scale(0.12, 0.12); 90 | -o-transform: rotate(33deg) scale(0.12, 0.12); 91 | } 92 | 93 | .star-sub4 { 94 | top: 50px; 95 | left: 25px; 96 | -moz-transform: rotate(35deg) scale(0.12, 0.12); 97 | -webkit-transform: rotate(55deg) scale(0.12, 0.12); 98 | -ms-transform: rotate(35deg) scale(0.12, 0.12); 99 | -o-transform: rotate(35deg) scale(0.12, 0.12); 100 | } 101 | } -------------------------------------------------------------------------------- /flags/less/colombia.less: -------------------------------------------------------------------------------- 1 | #colombia { 2 | background-image: -webkit-linear-gradient(#fcd116 50%, #003893 50%, #003893 75%, #ce1126 75%); 3 | background-image: -o-linear-gradient(#fcd116 50%, #003893 50%, #003893 75%, #ce1126 75%); 4 | background-image: -moz-linear-gradient(#fcd116 50%, #003893 50%, #003893 75%, #ce1126 75%); 5 | background-image: linear-gradient(#fcd116 50%, #003893 50%, #003893 75%, #ce1126 75%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/comoros.less: -------------------------------------------------------------------------------- 1 | #comoros { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(#ffc61e 25%, #ffffff 25%, #ffffff 50%, #ce1126 50%, #ce1126 75%, #3a75c4 75%); 4 | background-image: -o-linear-gradient(#ffc61e 25%, #ffffff 25%, #ffffff 50%, #ce1126 50%, #ce1126 75%, #3a75c4 75%); 5 | background-image: -moz-linear-gradient(#ffc61e 25%, #ffffff 25%, #ffffff 50%, #ce1126 50%, #ce1126 75%, #3a75c4 75%); 6 | background-image: linear-gradient(#ffc61e 25%, #ffffff 25%, #ffffff 50%, #ce1126 50%, #ce1126 75%, #3a75c4 75%); 7 | width: 208px; 8 | height: 125px; 9 | 10 | .triangle { 11 | top: 0px; 12 | left: 0px; 13 | width: 0; 14 | height: 0; 15 | border-top: 62.5px solid transparent; 16 | border-bottom: 62.5px solid transparent; 17 | border-left: 104px solid #3d8e33; 18 | } 19 | 20 | .moon { 21 | top: 33px; 22 | left: 7px; 23 | width: 60px; 24 | height: 58px; 25 | background: #ffffff; 26 | border-radius: 50%; 27 | 28 | .moon-clip { 29 | top: 0px; 30 | left: 13px; 31 | width: 55px; 32 | height: 58px; 33 | background: #3d8e33; 34 | border-radius: 50%; 35 | } 36 | 37 | .star { 38 | display: block; 39 | left: -15px; 40 | width: 0px; 41 | height: 0px; 42 | border-right: 50px solid transparent; 43 | border-bottom: 35px solid #ffffff; 44 | border-left: 50px solid transparent; 45 | -moz-transform: rotate(35deg) scale(0.1, 0.1); 46 | -webkit-transform: rotate(35deg) scale(0.1, 0.1); 47 | -ms-transform: rotate(35deg) scale(0.1, 0.1); 48 | -o-transform: rotate(35deg) scale(0.1, 0.1); 49 | 50 | &:before { 51 | content: ''; 52 | display: block; 53 | position: absolute; 54 | top: -22.5px; 55 | left: -32.5px; 56 | height: 0; 57 | width: 0; 58 | border-bottom: 40px solid #ffffff; 59 | border-left: 15px solid transparent; 60 | border-right: 15px solid transparent; 61 | -webkit-transform: rotate(-35deg); 62 | -moz-transform: rotate(-35deg); 63 | -ms-transform: rotate(-35deg); 64 | -o-transform: rotate(-35deg); 65 | } 66 | 67 | &:after { 68 | content: ''; 69 | display: block; 70 | position: absolute; 71 | top: 3px; 72 | left: -52.5px; 73 | width: 0px; 74 | height: 0px; 75 | border-right: 50px solid transparent; 76 | border-bottom: 35px solid #ffffff; 77 | border-left: 50px solid transparent; 78 | -webkit-transform: rotate(-70deg); 79 | -moz-transform: rotate(-70deg); 80 | -ms-transform: rotate(-70deg); 81 | -o-transform: rotate(-70deg); 82 | } 83 | } 84 | 85 | .star1 { 86 | top: -8px; 87 | } 88 | 89 | .star2 { 90 | top: 5px; 91 | } 92 | 93 | .star3 { 94 | top: 19px; 95 | } 96 | 97 | .star4 { 98 | top: 32px; 99 | } 100 | } 101 | } -------------------------------------------------------------------------------- /flags/less/cuba.less: -------------------------------------------------------------------------------- 1 | #cuba { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(#002a8f 20%, #ffffff 20%, #ffffff 40%, #002a8f 40%, #002a8f 60%, #ffffff 60%, #ffffff 80%, #002a8f 80%); 4 | background-image: -o-linear-gradient(#002a8f 20%, #ffffff 20%, #ffffff 40%, #002a8f 40%, #002a8f 60%, #ffffff 60%, #ffffff 80%, #002a8f 80%); 5 | background-image: -moz-linear-gradient(#002a8f 20%, #ffffff 20%, #ffffff 40%, #002a8f 40%, #002a8f 60%, #ffffff 60%, #ffffff 80%, #002a8f 80%); 6 | background-image: linear-gradient(#002a8f 20%, #ffffff 20%, #ffffff 40%, #002a8f 40%, #002a8f 60%, #ffffff 60%, #ffffff 80%, #002a8f 80%); 7 | width: 300px; 8 | height: 150px; 9 | 10 | .triangle { 11 | top: 0px; 12 | left: 0px; 13 | width: 0; 14 | height: 0; 15 | border-top: 75px solid transparent; 16 | border-bottom: 75px solid transparent; 17 | border-left: 130px solid #cf142b; 18 | } 19 | 20 | .star { 21 | display: block; 22 | top: 57px; 23 | left: -6px; 24 | width: 0px; 25 | height: 0px; 26 | border-right: 50px solid transparent; 27 | border-bottom: 35px solid #ffffff; 28 | border-left: 50px solid transparent; 29 | -moz-transform: rotate(35deg) scale(0.42, 0.42); 30 | -webkit-transform: rotate(35deg) scale(0.42, 0.42); 31 | -ms-transform: rotate(35deg) scale(0.42, 0.42); 32 | -o-transform: rotate(35deg) scale(0.42, 0.42); 33 | 34 | &:before { 35 | content: ''; 36 | display: block; 37 | position: absolute; 38 | top: -22.5px; 39 | left: -32.5px; 40 | height: 0; 41 | width: 0; 42 | border-bottom: 40px solid #ffffff; 43 | border-left: 15px solid transparent; 44 | border-right: 15px solid transparent; 45 | -webkit-transform: rotate(-35deg); 46 | -moz-transform: rotate(-35deg); 47 | -ms-transform: rotate(-35deg); 48 | -o-transform: rotate(-35deg); 49 | } 50 | 51 | &:after { 52 | content: ''; 53 | display: block; 54 | position: absolute; 55 | top: 3px; 56 | left: -52.5px; 57 | width: 0px; 58 | height: 0px; 59 | border-right: 50px solid transparent; 60 | border-bottom: 35px solid #ffffff; 61 | border-left: 50px solid transparent; 62 | -webkit-transform: rotate(-70deg); 63 | -moz-transform: rotate(-70deg); 64 | -ms-transform: rotate(-70deg); 65 | -o-transform: rotate(-70deg); 66 | } 67 | } 68 | } -------------------------------------------------------------------------------- /flags/less/czech-republic.less: -------------------------------------------------------------------------------- 1 | #czech-republic { 2 | background-image: linear-gradient(35deg, #11457e 50%, transparent 50%), linear-gradient(-35deg, transparent 50%, #11457e 50%), linear-gradient(#ffffff 50%, #d7141a 50%); 3 | background-size: 110px 75px, 110px 75px, 225px 150px; 4 | background-position: 0 0, 0 75px, 0 0; 5 | background-repeat: no-repeat, no-repeat, repeat; 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/djbouti.less: -------------------------------------------------------------------------------- 1 | #djbouti { 2 | position: relative; 3 | background-image: linear-gradient(30deg, #ffffff 50%, transparent 50%), linear-gradient(-30deg, transparent 50%, #ffffff 50%), linear-gradient(#6ab2e7 50%, #12ad2b 50%); 4 | background-size: 130px 75px, 130px 75px, 225px 150px; 5 | background-position: 0 0, 0 75px, 0 0; 6 | background-repeat: no-repeat, no-repeat, repeat; 7 | width: 225px; 8 | height: 150px; 9 | 10 | .star { 11 | display: block; 12 | top: 59px; 13 | left: 0; 14 | width: 0px; 15 | height: 0px; 16 | border-right: 50px solid transparent; 17 | border-bottom: 35px solid #d7141a; 18 | border-left: 50px solid transparent; 19 | -moz-transform: rotate(35deg) scale(0.38, 0.38); 20 | -webkit-transform: rotate(35deg) scale(0.38, 0.38); 21 | -ms-transform: rotate(35deg) scale(0.38, 0.38); 22 | -o-transform: rotate(35deg) scale(0.38, 0.38); 23 | 24 | &:before { 25 | content: ''; 26 | display: block; 27 | position: absolute; 28 | top: -22.5px; 29 | left: -32.5px; 30 | height: 0; 31 | width: 0; 32 | border-bottom: 40px solid #d7141a; 33 | border-left: 15px solid transparent; 34 | border-right: 15px solid transparent; 35 | -webkit-transform: rotate(-35deg); 36 | -moz-transform: rotate(-35deg); 37 | -ms-transform: rotate(-35deg); 38 | -o-transform: rotate(-35deg); 39 | } 40 | 41 | &:after { 42 | content: ''; 43 | display: block; 44 | position: absolute; 45 | top: 3px; 46 | left: -52.5px; 47 | width: 0px; 48 | height: 0px; 49 | border-right: 50px solid transparent; 50 | border-bottom: 35px solid #d7141a; 51 | border-left: 50px solid transparent; 52 | -webkit-transform: rotate(-70deg); 53 | -moz-transform: rotate(-70deg); 54 | -ms-transform: rotate(-70deg); 55 | -o-transform: rotate(-70deg); 56 | } 57 | } 58 | } -------------------------------------------------------------------------------- /flags/less/dominican-republic.less: -------------------------------------------------------------------------------- 1 | #dominican-republic { 2 | background-color: #002d62; 3 | background-image: linear-gradient(#ffffff 30px, transparent 30px), linear-gradient(90deg, #ffffff 30px, transparent 30px), linear-gradient(90deg, #ce1126 111px, transparent 111px), linear-gradient(90deg, transparent 111px, #ce1126 111px); 4 | background-size: 250px 93px, 140px 156px, 250px 63px, 250px 63px; 5 | background-position: 0 -30px, -30px 0, 0 93px, 0 0; 6 | background-repeat: repeat, repeat, no-repeat, no-repeat; 7 | width: 250px; 8 | height: 156px; 9 | } -------------------------------------------------------------------------------- /flags/less/drc.less: -------------------------------------------------------------------------------- 1 | #drc { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(-30deg, #007fff 41%, #f7d618 41%, #f7d618 44%, #ce1021 44%, #ce1021 56%, #f7d618 56%, #f7d618 59%, #007fff 59%); 4 | background-image: -o-linear-gradient(-30deg, #007fff 41%, #f7d618 41%, #f7d618 44%, #ce1021 44%, #ce1021 56%, #f7d618 56%, #f7d618 59%, #007fff 59%); 5 | background-image: -moz-linear-gradient(-30deg, #007fff 41%, #f7d618 41%, #f7d618 44%, #ce1021 44%, #ce1021 56%, #f7d618 56%, #f7d618 59%, #007fff 59%); 6 | background-image: linear-gradient(-30deg, #007fff 41%, #f7d618 41%, #f7d618 44%, #ce1021 44%, #ce1021 56%, #f7d618 56%, #f7d618 59%, #007fff 59%); 7 | width: 200px; 8 | height: 150px; 9 | 10 | .star { 11 | display: block; 12 | position: absolute; 13 | top: 21px; 14 | left: -12px; 15 | width: 0px; 16 | height: 0px; 17 | border-right: 50px solid transparent; 18 | border-bottom: 35px solid #f7d618; 19 | border-left: 50px solid transparent; 20 | -moz-transform: rotate(35deg) scale(0.53, 0.53); 21 | -webkit-transform: rotate(35deg) scale(0.53, 0.53); 22 | -ms-transform: rotate(35deg) scale(0.53, 0.53); 23 | -o-transform: rotate(35deg) scale(0.53, 0.53); 24 | 25 | &:before { 26 | content: ''; 27 | display: block; 28 | position: absolute; 29 | top: -22.5px; 30 | left: -32.5px; 31 | height: 0; 32 | width: 0; 33 | border-bottom: 40px solid #f7d618; 34 | border-left: 15px solid transparent; 35 | border-right: 15px solid transparent; 36 | -webkit-transform: rotate(-35deg); 37 | -moz-transform: rotate(-35deg); 38 | -ms-transform: rotate(-35deg); 39 | -o-transform: rotate(-35deg); 40 | } 41 | 42 | &:after { 43 | content: ''; 44 | display: block; 45 | position: absolute; 46 | top: 3px; 47 | left: -52.5px; 48 | width: 0px; 49 | height: 0px; 50 | border-right: 50px solid transparent; 51 | border-bottom: 35px solid #f7d618; 52 | border-left: 50px solid transparent; 53 | -webkit-transform: rotate(-70deg); 54 | -moz-transform: rotate(-70deg); 55 | -ms-transform: rotate(-70deg); 56 | -o-transform: rotate(-70deg); 57 | } 58 | } 59 | } -------------------------------------------------------------------------------- /flags/less/east-timor.less: -------------------------------------------------------------------------------- 1 | #east-timor { 2 | position: relative; 3 | background-color: #dc241f; 4 | background-image: linear-gradient(37deg, #000000 50%, transparent 50%), linear-gradient(-37deg, transparent 50%, #000000 50%), linear-gradient(27deg, #ffc726 50%, transparent 50%), linear-gradient(-27deg, transparent 50%, #ffc726 50%); 5 | background-size: 100px 75px, 100px 75px, 150px 75px, 150px 75px; 6 | background-position: 0 0, 0 75px, 0 0, 0 75px; 7 | background-repeat: no-repeat, no-repeat, no-repeat, no-repeat; 8 | width: 300px; 9 | height: 150px; 10 | 11 | .star { 12 | display: block; 13 | top: 56px; 14 | left: -12px; 15 | width: 0px; 16 | height: 0px; 17 | border-right: 50px solid transparent; 18 | border-bottom: 35px solid #ffffff; 19 | border-left: 50px solid transparent; 20 | -moz-transform: rotate(8deg) scale(0.48, 0.48); 21 | -webkit-transform: rotate(8deg) scale(0.48, 0.48); 22 | -ms-transform: rotate(8deg) scale(0.48, 0.48); 23 | -o-transform: rotate(8deg) scale(0.48, 0.48); 24 | 25 | &:before { 26 | content: ''; 27 | display: block; 28 | position: absolute; 29 | top: -22.5px; 30 | left: -32.5px; 31 | height: 0; 32 | width: 0; 33 | border-bottom: 40px solid #ffffff; 34 | border-left: 15px solid transparent; 35 | border-right: 15px solid transparent; 36 | -webkit-transform: rotate(-35deg); 37 | -moz-transform: rotate(-35deg); 38 | -ms-transform: rotate(-35deg); 39 | -o-transform: rotate(-35deg); 40 | } 41 | 42 | &:after { 43 | content: ''; 44 | display: block; 45 | position: absolute; 46 | top: 3px; 47 | left: -52.5px; 48 | width: 0px; 49 | height: 0px; 50 | border-right: 50px solid transparent; 51 | border-bottom: 35px solid #ffffff; 52 | border-left: 50px solid transparent; 53 | -webkit-transform: rotate(-70deg); 54 | -moz-transform: rotate(-70deg); 55 | -ms-transform: rotate(-70deg); 56 | -o-transform: rotate(-70deg); 57 | } 58 | } 59 | } -------------------------------------------------------------------------------- /flags/less/estonia.less: -------------------------------------------------------------------------------- 1 | #estonia { 2 | background-image: -webkit-linear-gradient(#4891d9 33%, #000000 33%, #000000 66%, #ffffff 66%); 3 | background-image: -o-linear-gradient(#4891d9 33%, #000000 33%, #000000 66%, #ffffff 66%); 4 | background-image: -moz-linear-gradient(#4891d9 33%, #000000 33%, #000000 66%, #ffffff 66%); 5 | background-image: linear-gradient(#4891d9 33%, #000000 33%, #000000 66%, #ffffff 66%); 6 | width: 236px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/finland.less: -------------------------------------------------------------------------------- 1 | #finland { 2 | background-color: #ffffff; 3 | background-image: linear-gradient(transparent 54px, #003580 54px), linear-gradient(90deg, transparent 68px, #003580 68px); 4 | background-size: 246px 96px, 110px 150px; 5 | background-repeat: no-repeat; 6 | width: 246px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/flags.less: -------------------------------------------------------------------------------- 1 | .flag { 2 | margin: 0 auto; 3 | } 4 | 5 | .flag * { 6 | position: absolute; 7 | box-sizing:content-box; 8 | -moz-box-sizing:content-box; 9 | } -------------------------------------------------------------------------------- /flags/less/france.less: -------------------------------------------------------------------------------- 1 | #france { 2 | background-image: -webkit-linear-gradient(90deg, #0055A4 33%, #ffffff 33%, #ffffff 66%, #EF4135 66%); 3 | background-image: -o-linear-gradient(90deg, #0055A4 33%, #ffffff 33%, #ffffff 66%, #EF4135 66%); 4 | background-image: -moz-linear-gradient(90deg, #0055A4 33%, #ffffff 33%, #ffffff 66%, #EF4135 66%); 5 | background-image: linear-gradient(90deg, #0055A4 33%, #ffffff 33%, #ffffff 66%, #EF4135 66%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/gabon.less: -------------------------------------------------------------------------------- 1 | #gabon { 2 | background-image: -webkit-linear-gradient(#009e60 33%, #fcd116 33%, #fcd116 66%, #3a75c4 66%); 3 | background-image: -o-linear-gradient(#009e60 33%, #fcd116 33%, #fcd116 66%, #3a75c4 66%); 4 | background-image: -moz-linear-gradient(#009e60 33%, #fcd116 33%, #fcd116 66%, #3a75c4 66%); 5 | background-image: linear-gradient(#009e60 33%, #fcd116 33%, #fcd116 66%, #3a75c4 66%); 6 | width: 200px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/gambia.less: -------------------------------------------------------------------------------- 1 | #gambia { 2 | background-image: -webkit-linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 38%, #0c1c8c 38%, #0c1c8c 62%, #ffffff 62%, #ffffff 67%, #3a7728 67%); 3 | background-image: -o-linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 38%, #0c1c8c 38%, #0c1c8c 62%, #ffffff 62%, #ffffff 67%, #3a7728 67%); 4 | background-image: -moz-linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 38%, #0c1c8c 38%, #0c1c8c 62%, #ffffff 62%, #ffffff 67%, #3a7728 67%); 5 | background-image: linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 38%, #0c1c8c 38%, #0c1c8c 62%, #ffffff 62%, #ffffff 67%, #3a7728 67%); 6 | width: 200px; 7 | height: 133px; 8 | } -------------------------------------------------------------------------------- /flags/less/germany.less: -------------------------------------------------------------------------------- 1 | #germany { 2 | background-image: -webkit-linear-gradient(#000000 33%, #dd0000 33%, #dd0000 66%, #ffce00 66%); 3 | background-image: -o-linear-gradient(#000000 33%, #dd0000 33%, #dd0000 66%, #ffce00 66%); 4 | background-image: -moz-linear-gradient(#000000 33%, #dd0000 33%, #dd0000 66%, #ffce00 66%); 5 | background-image: linear-gradient(#000000 33%, #dd0000 33%, #dd0000 66%, #ffce00 66%); 6 | width: 250px; 7 | height: 133px; 8 | } -------------------------------------------------------------------------------- /flags/less/greece.less: -------------------------------------------------------------------------------- 1 | #greece { 2 | background-image: -webkit-linear-gradient(90deg, transparent 15%, #ffffff 15%, #ffffff 22.5%, transparent 22.5%), -webkit-linear-gradient(transparent 22%, #ffffff 22%, #ffffff 33%, transparent 33%), -webkit-linear-gradient(#0d5eaf 50%, #0d5eaf 50%), -webkit-linear-gradient(#0d5eaf 50%, #ffffff 50%); 3 | background-image: -o-linear-gradient(90deg, transparent 15%, #ffffff 15%, #ffffff 22.5%, transparent 22.5%), -o-linear-gradient(transparent 22%, #ffffff 22%, #ffffff 33%, transparent 33%), -o-linear-gradient(#0d5eaf 50%, #0d5eaf 50%), -o-linear-gradient(#0d5eaf 50%, #ffffff 50%); 4 | background-image: -moz-linear-gradient(90deg, transparent 15%, #ffffff 15%, #ffffff 22.5%, transparent 22.5%), -moz-linear-gradient(transparent 22%, #ffffff 22%, #ffffff 33%, transparent 33%), -moz-linear-gradient(#0d5eaf 50%, #0d5eaf 50%), -moz-linear-gradient(#0d5eaf 50%, #ffffff 50%); 5 | background-image: linear-gradient(90deg, transparent 15%, #ffffff 15%, #ffffff 22.5%, transparent 22.5%), linear-gradient(transparent 22%, #ffffff 22%, #ffffff 33%, transparent 33%), linear-gradient(#0d5eaf 50%, #0d5eaf 50%), linear-gradient(#0d5eaf 50%, #ffffff 50%); 6 | background-size: 100% 55%, 36.6% 100%, 36.8% 55%, 100% 22.2%; 7 | background-repeat: no-repeat, no-repeat, no-repeat, repeat; 8 | width: 225px; 9 | height: 150px; 10 | } -------------------------------------------------------------------------------- /flags/less/iceland.less: -------------------------------------------------------------------------------- 1 | #iceland { 2 | background-color: #003897; 3 | background-image: -webkit-linear-gradient(#d72828 16px, transparent 16px), linear-gradient(90deg, #d72828 16px, transparent 16px), linear-gradient(white 32px, transparent 32px), linear-gradient(90deg, white 32px, transparent 32px); 4 | background-image: -o-linear-gradient(#d72828 16px, transparent 16px), linear-gradient(90deg, #d72828 16px, transparent 16px), linear-gradient(white 32px, transparent 32px), linear-gradient(90deg, white 32px, transparent 32px); 5 | background-image: -moz-linear-gradient(#d72828 16px, transparent 16px), linear-gradient(90deg, #d72828 16px, transparent 16px), linear-gradient(white 32px, transparent 32px), linear-gradient(90deg, white 32px, transparent 32px); 6 | background-image: linear-gradient(#d72828 16px, transparent 16px), linear-gradient(90deg, #d72828 16px, transparent 16px), linear-gradient(white 32px, transparent 32px), linear-gradient(90deg, white 32px, transparent 32px); 7 | background-size: 121px 91px, 143px 91px, 21px 91px, 165px 91px; 8 | background-position: -24px -24px, -77px -24px, -32px -32px, -107px -32px; 9 | width: 209px; 10 | height: 150px; 11 | } -------------------------------------------------------------------------------- /flags/less/ireland.less: -------------------------------------------------------------------------------- 1 | #ireland { 2 | background-image: -webkit-linear-gradient(90deg, #009A49 33%, #ffffff 33%, #ffffff 66%, #FF7900 66%); 3 | background-image: -o-linear-gradient(90deg, #009A49 33%, #ffffff 33%, #ffffff 66%, #FF7900 66%); 4 | background-image: -moz-linear-gradient(90deg, #009A49 33%, #ffffff 33%, #ffffff 66%, #FF7900 66%); 5 | background-image: linear-gradient(90deg, #009A49 33%, #ffffff 33%, #ffffff 66%, #FF7900 66%); 6 | width: 250px; 7 | height: 125px; 8 | } -------------------------------------------------------------------------------- /flags/less/japan.less: -------------------------------------------------------------------------------- 1 | #japan { 2 | position: relative; 3 | background: #ffffff; 4 | width: 225px; 5 | height: 150px; 6 | border: 1px solid #dddddd; 7 | 8 | .middle { 9 | display: block; 10 | width: 91px; 11 | top: 29px; 12 | left: 67px; 13 | height: 91px; 14 | background: #bc002d; 15 | border-radius: 50%; 16 | -webkit-border-radius: 50%; 17 | -moz-border-radius: 50%; 18 | } 19 | } -------------------------------------------------------------------------------- /flags/less/kenya.less: -------------------------------------------------------------------------------- 1 | #kenya { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(#000000 30%, #ffffff 30%, #ffffff 35%, #bb0000 35%, #bb0000 61%, #ffffff 61%, #ffffff 66%, #006600 66%); 4 | background-image: -o-linear-gradient(#000000 30%, #ffffff 30%, #ffffff 35%, #bb0000 35%, #bb0000 61%, #ffffff 61%, #ffffff 66%, #006600 66%); 5 | background-image: -moz-linear-gradient(#000000 30%, #ffffff 30%, #ffffff 35%, #bb0000 35%, #bb0000 61%, #ffffff 61%, #ffffff 66%, #006600 66%); 6 | background-image: linear-gradient(#000000 30%, #ffffff 30%, #ffffff 35%, #bb0000 35%, #bb0000 61%, #ffffff 61%, #ffffff 66%, #006600 66%); 7 | width: 225px; 8 | height: 150px; 9 | 10 | .spear-left { 11 | top: 37px; 12 | left: 108px; 13 | width: 2px; 14 | height: 89px; 15 | background: #ffffff; 16 | -webkit-transform: rotate(30deg); 17 | -ms-transform: rotate(30deg); 18 | transform: rotate(30deg); 19 | 20 | &:after { 21 | content: " "; 22 | top: -22px; 23 | left: -2px; 24 | width: 6px; 25 | height: 23px; 26 | background: #ffffff; 27 | position: absolute; 28 | -webkit-border-radius: 50% 50% 40% 40% / 50% 50% 20% 20%; 29 | -moz-border-radius: 50% 50% 40% 40% / 50% 50% 20% 20%; 30 | border-radius: 50% 50% 40% 40% / 50% 50% 20% 20%; 31 | } 32 | } 33 | 34 | .spear-right { 35 | top: 37px; 36 | left: 115px; 37 | width: 2px; 38 | height: 89px; 39 | background: #ffffff; 40 | -webkit-transform: rotate(-30deg); 41 | -ms-transform: rotate(-30deg); 42 | transform: rotate(-30deg); 43 | 44 | &:after { 45 | content: " "; 46 | top: -22px; 47 | left: -2px; 48 | width: 6px; 49 | height: 23px; 50 | background: #ffffff; 51 | position: absolute; 52 | -webkit-border-radius: 50% 50% 40% 40% / 50% 50% 20% 20%; 53 | -moz-border-radius: 50% 50% 40% 40% / 50% 50% 20% 20%; 54 | border-radius: 50% 50% 40% 40% / 50% 50% 20% 20%; 55 | } 56 | } 57 | 58 | .shield { 59 | top: 31px; 60 | left: 90px; 61 | width: 45px; 62 | height: 89px; 63 | background: #bb0000; 64 | -webkit-border-radius: 50%; 65 | -moz-border-radius: 50%; 66 | border-radius: 50%; 67 | } 68 | 69 | .shield-left { 70 | top: 23px; 71 | left: 0px; 72 | width: 9px; 73 | height: 41px; 74 | background: #000000; 75 | -webkit-border-radius: 50%; 76 | -moz-border-radius: 50%; 77 | border-radius: 50%; 78 | } 79 | 80 | .shield-right { 81 | top: 23px; 82 | right: 0px; 83 | width: 9px; 84 | height: 41px; 85 | background: #000000; 86 | -webkit-border-radius: 50%; 87 | -moz-border-radius: 50%; 88 | border-radius: 50%; 89 | } 90 | 91 | .shield-top { 92 | top: 0px; 93 | left: 18px; 94 | width: 9px; 95 | height: 39px; 96 | background: #ffffff; 97 | -webkit-border-radius: 50%; 98 | -moz-border-radius: 50%; 99 | border-radius: 50%; 100 | } 101 | 102 | .shield-bottom { 103 | bottom: 0px; 104 | left: 18px; 105 | width: 9px; 106 | height: 39px; 107 | background: #ffffff; 108 | -webkit-border-radius: 50%; 109 | -moz-border-radius: 50%; 110 | border-radius: 50%; 111 | } 112 | 113 | .shield-line { 114 | top: 0px; 115 | left: 22px; 116 | width: 1px; 117 | height: 89px; 118 | background: #bb0000; 119 | } 120 | 121 | .shield-middle { 122 | top: 39px; 123 | left: 19px; 124 | width: 7px; 125 | height: 10px; 126 | background: #ffffff; 127 | -webkit-border-radius: 50%; 128 | -moz-border-radius: 50%; 129 | border-radius: 50%; 130 | } 131 | } -------------------------------------------------------------------------------- /flags/less/mixins.less: -------------------------------------------------------------------------------- 1 | .rotate (@deg) { 2 | -webkit-transform: rotate(@deg); 3 | -ms-transform: rotate(@deg); 4 | transform: rotate(@deg); 5 | } -------------------------------------------------------------------------------- /flags/less/normalize.less: -------------------------------------------------------------------------------- 1 | /*! normalize.css v1.1.3 | MIT License | git.io/normalize */ 2 | 3 | /* ========================================================================== 4 | HTML5 display definitions 5 | ========================================================================== */ 6 | 7 | /** 8 | * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3. 9 | */ 10 | 11 | article, 12 | aside, 13 | details, 14 | figcaption, 15 | figure, 16 | footer, 17 | header, 18 | hgroup, 19 | main, 20 | nav, 21 | section, 22 | summary { 23 | display: block; 24 | } 25 | 26 | /** 27 | * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3. 28 | */ 29 | 30 | audio, 31 | canvas, 32 | video { 33 | display: inline-block; 34 | *display: inline; 35 | *zoom: 1; 36 | } 37 | 38 | /** 39 | * Prevent modern browsers from displaying `audio` without controls. 40 | * Remove excess height in iOS 5 devices. 41 | */ 42 | 43 | audio:not([controls]) { 44 | display: none; 45 | height: 0; 46 | } 47 | 48 | /** 49 | * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4. 50 | * Known issue: no IE 6 support. 51 | */ 52 | 53 | [hidden] { 54 | display: none; 55 | } 56 | 57 | /* ========================================================================== 58 | Base 59 | ========================================================================== */ 60 | 61 | /** 62 | * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using 63 | * `em` units. 64 | * 2. Prevent iOS text size adjust after orientation change, without disabling 65 | * user zoom. 66 | */ 67 | 68 | html { 69 | font-size: 100%; /* 1 */ 70 | -ms-text-size-adjust: 100%; /* 2 */ 71 | -webkit-text-size-adjust: 100%; /* 2 */ 72 | } 73 | 74 | /** 75 | * Address `font-family` inconsistency between `textarea` and other form 76 | * elements. 77 | */ 78 | 79 | html, 80 | button, 81 | input, 82 | select, 83 | textarea { 84 | font-family: sans-serif; 85 | } 86 | 87 | /** 88 | * Address margins handled incorrectly in IE 6/7. 89 | */ 90 | 91 | body { 92 | margin: 0; 93 | } 94 | 95 | /* ========================================================================== 96 | Links 97 | ========================================================================== */ 98 | 99 | /** 100 | * Address `outline` inconsistency between Chrome and other browsers. 101 | */ 102 | 103 | a:focus { 104 | outline: thin dotted; 105 | } 106 | 107 | /** 108 | * Improve readability when focused and also mouse hovered in all browsers. 109 | */ 110 | 111 | a:active, 112 | a:hover { 113 | outline: 0; 114 | } 115 | 116 | /* ========================================================================== 117 | Typography 118 | ========================================================================== */ 119 | 120 | /** 121 | * Address font sizes and margins set differently in IE 6/7. 122 | * Address font sizes within `section` and `article` in Firefox 4+, Safari 5, 123 | * and Chrome. 124 | */ 125 | 126 | h1 { 127 | font-size: 2em; 128 | margin: 0.67em 0; 129 | } 130 | 131 | h2 { 132 | font-size: 1.5em; 133 | margin: 0.83em 0; 134 | } 135 | 136 | h3 { 137 | font-size: 1.17em; 138 | margin: 1em 0; 139 | } 140 | 141 | h4 { 142 | font-size: 1em; 143 | margin: 1.33em 0; 144 | } 145 | 146 | h5 { 147 | font-size: 0.83em; 148 | margin: 1.67em 0; 149 | } 150 | 151 | h6 { 152 | font-size: 0.67em; 153 | margin: 2.33em 0; 154 | } 155 | 156 | /** 157 | * Address styling not present in IE 7/8/9, Safari 5, and Chrome. 158 | */ 159 | 160 | abbr[title] { 161 | border-bottom: 1px dotted; 162 | } 163 | 164 | /** 165 | * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome. 166 | */ 167 | 168 | b, 169 | strong { 170 | font-weight: bold; 171 | } 172 | 173 | blockquote { 174 | margin: 1em 40px; 175 | } 176 | 177 | /** 178 | * Address styling not present in Safari 5 and Chrome. 179 | */ 180 | 181 | dfn { 182 | font-style: italic; 183 | } 184 | 185 | /** 186 | * Address differences between Firefox and other browsers. 187 | * Known issue: no IE 6/7 normalization. 188 | */ 189 | 190 | hr { 191 | -moz-box-sizing: content-box; 192 | box-sizing: content-box; 193 | height: 0; 194 | } 195 | 196 | /** 197 | * Address styling not present in IE 6/7/8/9. 198 | */ 199 | 200 | mark { 201 | background: #ff0; 202 | color: #000; 203 | } 204 | 205 | /** 206 | * Address margins set differently in IE 6/7. 207 | */ 208 | 209 | p, 210 | pre { 211 | margin: 1em 0; 212 | } 213 | 214 | /** 215 | * Correct font family set oddly in IE 6, Safari 4/5, and Chrome. 216 | */ 217 | 218 | code, 219 | kbd, 220 | pre, 221 | samp { 222 | font-family: monospace, serif; 223 | _font-family: 'courier new', monospace; 224 | font-size: 1em; 225 | } 226 | 227 | /** 228 | * Improve readability of pre-formatted text in all browsers. 229 | */ 230 | 231 | pre { 232 | white-space: pre; 233 | white-space: pre-wrap; 234 | word-wrap: break-word; 235 | } 236 | 237 | /** 238 | * Address CSS quotes not supported in IE 6/7. 239 | */ 240 | 241 | q { 242 | quotes: none; 243 | } 244 | 245 | /** 246 | * Address `quotes` property not supported in Safari 4. 247 | */ 248 | 249 | q:before, 250 | q:after { 251 | content: ''; 252 | content: none; 253 | } 254 | 255 | /** 256 | * Address inconsistent and variable font size in all browsers. 257 | */ 258 | 259 | small { 260 | font-size: 80%; 261 | } 262 | 263 | /** 264 | * Prevent `sub` and `sup` affecting `line-height` in all browsers. 265 | */ 266 | 267 | sub, 268 | sup { 269 | font-size: 75%; 270 | line-height: 0; 271 | position: relative; 272 | vertical-align: baseline; 273 | } 274 | 275 | sup { 276 | top: -0.5em; 277 | } 278 | 279 | sub { 280 | bottom: -0.25em; 281 | } 282 | 283 | /* ========================================================================== 284 | Lists 285 | ========================================================================== */ 286 | 287 | /** 288 | * Address margins set differently in IE 6/7. 289 | */ 290 | 291 | dl, 292 | menu, 293 | ol, 294 | ul { 295 | margin: 1em 0; 296 | } 297 | 298 | dd { 299 | margin: 0 0 0 40px; 300 | } 301 | 302 | /** 303 | * Address paddings set differently in IE 6/7. 304 | */ 305 | 306 | menu, 307 | ol, 308 | ul { 309 | padding: 0 0 0 40px; 310 | } 311 | 312 | /** 313 | * Correct list images handled incorrectly in IE 7. 314 | */ 315 | 316 | nav ul, 317 | nav ol { 318 | list-style: none; 319 | list-style-image: none; 320 | } 321 | 322 | /* ========================================================================== 323 | Embedded content 324 | ========================================================================== */ 325 | 326 | /** 327 | * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3. 328 | * 2. Improve image quality when scaled in IE 7. 329 | */ 330 | 331 | img { 332 | border: 0; /* 1 */ 333 | -ms-interpolation-mode: bicubic; /* 2 */ 334 | } 335 | 336 | /** 337 | * Correct overflow displayed oddly in IE 9. 338 | */ 339 | 340 | svg:not(:root) { 341 | overflow: hidden; 342 | } 343 | 344 | /* ========================================================================== 345 | Figures 346 | ========================================================================== */ 347 | 348 | /** 349 | * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11. 350 | */ 351 | 352 | figure { 353 | margin: 0; 354 | } 355 | 356 | /* ========================================================================== 357 | Forms 358 | ========================================================================== */ 359 | 360 | /** 361 | * Correct margin displayed oddly in IE 6/7. 362 | */ 363 | 364 | form { 365 | margin: 0; 366 | } 367 | 368 | /** 369 | * Define consistent border, margin, and padding. 370 | */ 371 | 372 | fieldset { 373 | border: 1px solid #c0c0c0; 374 | margin: 0 2px; 375 | padding: 0.35em 0.625em 0.75em; 376 | } 377 | 378 | /** 379 | * 1. Correct color not being inherited in IE 6/7/8/9. 380 | * 2. Correct text not wrapping in Firefox 3. 381 | * 3. Correct alignment displayed oddly in IE 6/7. 382 | */ 383 | 384 | legend { 385 | border: 0; /* 1 */ 386 | padding: 0; 387 | white-space: normal; /* 2 */ 388 | *margin-left: -7px; /* 3 */ 389 | } 390 | 391 | /** 392 | * 1. Correct font size not being inherited in all browsers. 393 | * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5, 394 | * and Chrome. 395 | * 3. Improve appearance and consistency in all browsers. 396 | */ 397 | 398 | button, 399 | input, 400 | select, 401 | textarea { 402 | font-size: 100%; /* 1 */ 403 | margin: 0; /* 2 */ 404 | vertical-align: baseline; /* 3 */ 405 | *vertical-align: middle; /* 3 */ 406 | } 407 | 408 | /** 409 | * Address Firefox 3+ setting `line-height` on `input` using `!important` in 410 | * the UA stylesheet. 411 | */ 412 | 413 | button, 414 | input { 415 | line-height: normal; 416 | } 417 | 418 | /** 419 | * Address inconsistent `text-transform` inheritance for `button` and `select`. 420 | * All other form control elements do not inherit `text-transform` values. 421 | * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+. 422 | * Correct `select` style inheritance in Firefox 4+ and Opera. 423 | */ 424 | 425 | button, 426 | select { 427 | text-transform: none; 428 | } 429 | 430 | /** 431 | * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio` 432 | * and `video` controls. 433 | * 2. Correct inability to style clickable `input` types in iOS. 434 | * 3. Improve usability and consistency of cursor style between image-type 435 | * `input` and others. 436 | * 4. Remove inner spacing in IE 7 without affecting normal text inputs. 437 | * Known issue: inner spacing remains in IE 6. 438 | */ 439 | 440 | button, 441 | html input[type="button"], /* 1 */ 442 | input[type="reset"], 443 | input[type="submit"] { 444 | -webkit-appearance: button; /* 2 */ 445 | cursor: pointer; /* 3 */ 446 | *overflow: visible; /* 4 */ 447 | } 448 | 449 | /** 450 | * Re-set default cursor for disabled elements. 451 | */ 452 | 453 | button[disabled], 454 | html input[disabled] { 455 | cursor: default; 456 | } 457 | 458 | /** 459 | * 1. Address box sizing set to content-box in IE 8/9. 460 | * 2. Remove excess padding in IE 8/9. 461 | * 3. Remove excess padding in IE 7. 462 | * Known issue: excess padding remains in IE 6. 463 | */ 464 | 465 | input[type="checkbox"], 466 | input[type="radio"] { 467 | box-sizing: border-box; /* 1 */ 468 | padding: 0; /* 2 */ 469 | *height: 13px; /* 3 */ 470 | *width: 13px; /* 3 */ 471 | } 472 | 473 | /** 474 | * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome. 475 | * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome 476 | * (include `-moz` to future-proof). 477 | */ 478 | 479 | input[type="search"] { 480 | -webkit-appearance: textfield; /* 1 */ 481 | -moz-box-sizing: content-box; 482 | -webkit-box-sizing: content-box; /* 2 */ 483 | box-sizing: content-box; 484 | } 485 | 486 | /** 487 | * Remove inner padding and search cancel button in Safari 5 and Chrome 488 | * on OS X. 489 | */ 490 | 491 | input[type="search"]::-webkit-search-cancel-button, 492 | input[type="search"]::-webkit-search-decoration { 493 | -webkit-appearance: none; 494 | } 495 | 496 | /** 497 | * Remove inner padding and border in Firefox 3+. 498 | */ 499 | 500 | button::-moz-focus-inner, 501 | input::-moz-focus-inner { 502 | border: 0; 503 | padding: 0; 504 | } 505 | 506 | /** 507 | * 1. Remove default vertical scrollbar in IE 6/7/8/9. 508 | * 2. Improve readability and alignment in all browsers. 509 | */ 510 | 511 | textarea { 512 | overflow: auto; /* 1 */ 513 | vertical-align: top; /* 2 */ 514 | } 515 | 516 | /* ========================================================================== 517 | Tables 518 | ========================================================================== */ 519 | 520 | /** 521 | * Remove most spacing between table cells. 522 | */ 523 | 524 | table { 525 | border-collapse: collapse; 526 | border-spacing: 0; 527 | } 528 | -------------------------------------------------------------------------------- /flags/less/north-korea.less: -------------------------------------------------------------------------------- 1 | #north-korea { 2 | position: relative; 3 | background-image: -webkit-linear-gradient(#024fa2 17%, #ffffff 17%, #ffffff 19.5%, #ed1c27 19.5%, #ed1c27 80.5%, #ffffff 80.5%, #ffffff 83%, #024fa2 83%); 4 | background-image: -o-linear-gradient(#024fa2 17%, #ffffff 17%, #ffffff 19.5%, #ed1c27 19.5%, #ed1c27 80.5%, #ffffff 80.5%, #ffffff 83%, #024fa2 83%); 5 | background-image: -moz-linear-gradient(#024fa2 17%, #ffffff 17%, #ffffff 19.5%, #ed1c27 19.5%, #ed1c27 80.5%, #ffffff 80.5%, #ffffff 83%, #024fa2 83%); 6 | background-image: linear-gradient(#024fa2 17%, #ffffff 17%, #ffffff 19.5%, #ed1c27 19.5%, #ed1c27 80.5%, #ffffff 80.5%, #ffffff 83%, #024fa2 83%); 7 | width: 300px; 8 | height: 150px; 9 | 10 | &:after { 11 | content: " "; 12 | position: absolute; 13 | top: 28%; 14 | left: 22%; 15 | width: 22%; 16 | height: 44%; 17 | background: #ffffff; 18 | -webkit-border-radius: 50%; 19 | -moz-border-radius: 50%; 20 | border-radius: 50%; 21 | } 22 | 23 | .star { 24 | display: block; 25 | position: absolute; 26 | top: 56px; 27 | left: 51px; 28 | width: 0px; 29 | height: 0px; 30 | border-right: 50px solid transparent; 31 | border-bottom: 35px solid #ed1c27; 32 | border-left: 50px solid transparent; 33 | -moz-transform: rotate(35deg) scale(0.6, 0.6); 34 | -webkit-transform: rotate(35deg) scale(0.6, 0.6); 35 | -ms-transform: rotate(35deg) scale(0.6, 0.6); 36 | -o-transform: rotate(35deg) scale(0.6, 0.6); 37 | z-index: 99; 38 | 39 | &:before { 40 | content: ''; 41 | display: block; 42 | position: absolute; 43 | top: -25.5px; 44 | left: -32.5px; 45 | height: 0; 46 | width: 0; 47 | border-bottom: 40px solid #ed1c27; 48 | border-left: 15px solid transparent; 49 | border-right: 15px solid transparent; 50 | -webkit-transform: rotate(-35deg); 51 | -moz-transform: rotate(-35deg); 52 | -ms-transform: rotate(-35deg); 53 | -o-transform: rotate(-35deg); 54 | } 55 | 56 | &:after { 57 | content: ''; 58 | display: block; 59 | position: absolute; 60 | top: 1px; 61 | left: -50.5px; 62 | width: 0px; 63 | height: 0px; 64 | border-right: 50px solid transparent; 65 | border-bottom: 35px solid #ed1c27; 66 | border-left: 50px solid transparent; 67 | -webkit-transform: rotate(-70deg); 68 | -moz-transform: rotate(-70deg); 69 | -ms-transform: rotate(-70deg); 70 | -o-transform: rotate(-70deg); 71 | } 72 | } 73 | } -------------------------------------------------------------------------------- /flags/less/norway.less: -------------------------------------------------------------------------------- 1 | #norway { 2 | background-color: #ef2b2d; 3 | background-image: -webkit-linear-gradient(#002868 16px, transparent 16px), linear-gradient(90deg, #002868 16px, transparent 16px), linear-gradient(#ffffff 32px, transparent 32px), linear-gradient(90deg, #ffffff 32px, transparent 32px); 4 | background-image: -o-linear-gradient(#002868 16px, transparent 16px), linear-gradient(90deg, #002868 16px, transparent 16px), linear-gradient(#ffffff 32px, transparent 32px), linear-gradient(90deg, #ffffff 32px, transparent 32px); 5 | background-image: -moz-linear-gradient(#002868 16px, transparent 16px), linear-gradient(90deg, #002868 16px, transparent 16px), linear-gradient(#ffffff 32px, transparent 32px), linear-gradient(90deg, #ffffff 32px, transparent 32px); 6 | background-image: linear-gradient(transparent 67px, #002868 67px), linear-gradient(90deg, transparent 67px, #002868 67px), linear-gradient(transparent 59px, #ffffff 59px), linear-gradient(90deg, transparent 59px, #ffffff 59px); 7 | background-size: 209px 83px, 83px 150px, 209px 91px, 91px 150px; 8 | background-repeat: no-repeat; 9 | width: 209px; 10 | height: 150px; 11 | } -------------------------------------------------------------------------------- /flags/less/philippines.less: -------------------------------------------------------------------------------- 1 | @import "mixins.less"; 2 | 3 | @flag-width: 300px; 4 | @flag-height: 150px; 5 | 6 | #philippines { 7 | width: @flag-width; 8 | height: @flag-height; 9 | position: relative; 10 | background-image: -webkit-linear-gradient(#0038A8 50%, #CE1126 50%); 11 | background-image: -o-linear-gradient(#0038A8 50%, #CE1126 50%); 12 | background-image: linear-gradient(#0038A8 50%, #CE1126 50%); 13 | 14 | .triangle { 15 | border-top: 75px solid transparent; 16 | border-bottom: 75px solid transparent; 17 | border-left: 130px solid white; 18 | } 19 | 20 | .star { 21 | color: #FCD116; 22 | font-size: 20px; 23 | position: absolute; 24 | 25 | &:before { 26 | content: '★'; 27 | } 28 | 29 | &.first { 30 | top: 4px; 31 | left: 2px; 32 | .rotate(-30deg); 33 | } 34 | &.second { 35 | bottom: 8px; 36 | left: 2px; 37 | .rotate(-7.5deg); 38 | } 39 | &.third { 40 | top: 60px; 41 | left: 97px; 42 | .rotate(17.5deg); 43 | } 44 | } 45 | 46 | .sun { 47 | @diameter: 34px; 48 | background: #FCD116; 49 | position: absolute; 50 | height: @diameter; 51 | width: @diameter; 52 | left: 30px; 53 | top: 58px; 54 | border-radius: @diameter/2; 55 | 56 | .ray:nth-child(1) { 57 | top: -24px; 58 | left: 10px; 59 | } 60 | 61 | .ray:nth-child(2) { 62 | left: -13px; 63 | top: -13px; 64 | .rotate(-45deg); 65 | } 66 | 67 | .ray:nth-child(3) { 68 | left: 34px; 69 | top: -13px; 70 | .rotate(45deg); 71 | } 72 | 73 | .ray:nth-child(4) { 74 | left: -23px; 75 | top: 10px; 76 | .rotate(-90deg); 77 | } 78 | 79 | .ray:nth-child(5) { 80 | left: 44px; 81 | top: 10px; 82 | .rotate(90deg); 83 | } 84 | 85 | .ray:nth-child(6) { 86 | left: -13px; 87 | top: 34px; 88 | .rotate(-135deg); 89 | } 90 | 91 | .ray:nth-child(7) { 92 | top: 44px; 93 | left: 10px; 94 | .rotate(180deg); 95 | } 96 | 97 | .ray:nth-child(8) { 98 | left: 34px; 99 | top: 34px; 100 | .rotate(135deg); 101 | } 102 | 103 | .ray { 104 | height: 0; 105 | width: 0; 106 | border-width: 6px; 107 | border-style: solid; 108 | border-color: transparent transparent #FCD116 transparent; 109 | position: absolute; 110 | 111 | &:before, 112 | &:after { 113 | content: ''; 114 | background-color: #FCD116; 115 | position: absolute; 116 | display: block; 117 | width: 7px; 118 | height: 13px; 119 | top: 5px; 120 | } 121 | 122 | &:before { 123 | left: -2px; 124 | .rotate(10deg); 125 | } 126 | 127 | &:after { 128 | left: -5px; 129 | .rotate(-10deg); 130 | } 131 | 132 | > i, 133 | > i:before { 134 | position: absolute; 135 | display: block; 136 | width: 2px; 137 | height: 17px; 138 | top: 0; 139 | background: white; 140 | } 141 | 142 | > i { 143 | left: -4px; 144 | .rotate(-8deg); 145 | z-index: 1; 146 | } 147 | 148 | > i:before { 149 | content: ''; 150 | left: 6px; 151 | .rotate(15deg); 152 | z-index: 1; 153 | } 154 | } 155 | } 156 | } -------------------------------------------------------------------------------- /flags/less/republic-of-the-congo.less: -------------------------------------------------------------------------------- 1 | #republic-of-the-congo { 2 | background-image: -webkit-linear-gradient(135deg, #009543 40%, #fbde4a 40%, #fbde4a 60%, #dc241f 57%); 3 | background-image: -o-linear-gradient(135deg, #009543 40%, #fbde4a 40%, #fbde4a 60%, #dc241f 57%); 4 | background-image: -moz-linear-gradient(135deg, #009543 40%, #fbde4a 40%, #fbde4a 60%, #dc241f 57%); 5 | background-image: linear-gradient(135deg, #009543 40%, #fbde4a 40%, #fbde4a 60%, #dc241f 57%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/romania.less: -------------------------------------------------------------------------------- 1 | #romania { 2 | background-image: -webkit-linear-gradient(90deg, #002B7F 33%, #FCD116 33%, #FCD116 66%, #CE1126 66%); 3 | background-image: -o-linear-gradient(90deg, #002B7F 33%, #FCD116 33%, #FCD116 66%, #CE1126 66%); 4 | background-image: -moz-linear-gradient(90deg, #002B7F 33%, #FCD116 33%, #FCD116 66%, #CE1126 66%); 5 | background-image: linear-gradient(90deg, #002B7F 33%, #FCD116 33%, #FCD116 66%, #CE1126 66%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/less/rwanda.less: -------------------------------------------------------------------------------- 1 | #rwanda 2 | { 3 | position: relative; 4 | background-image: -webkit-linear-gradient(#00a1de 40%, #00a1de 56%, #fad201 56%, #fad201 80%, #20603d 80%); 5 | background-image: -o-linear-gradient(#00a1de 40%, #00a1de 56%, #fad201 56%, #fad201 80%, #20603d 80%); 6 | background-image: -moz-linear-gradient(#00a1de 40%, #00a1de 56%, #fad201 56%, #fad201 80%, #20603d 80%); 7 | background-image: linear-gradient(#00a1de 40%, #00a1de 56%, #fad201 56%, #fad201 80%, #20603d 80%); 8 | width: 250px; 9 | height: 167px; 10 | 11 | .star 12 | { 13 | position: absolute; 14 | width: 0; 15 | height: 0; 16 | border-left: 1px solid transparent; 17 | border-right: 1px solid transparent; 18 | border-bottom: 16px solid #e5be01; 19 | } 20 | 21 | .star1 22 | { 23 | top: 18px; 24 | left: 204px; 25 | } 26 | 27 | .star2 28 | { 29 | top: 20px; 30 | left: 208px; 31 | -webkit-transform: rotate(14deg); 32 | -ms-transform: rotate(14deg); 33 | transform: rotate(14deg); 34 | } 35 | 36 | .star3 37 | { 38 | top: 22px; 39 | left: 212px; 40 | -webkit-transform: rotate(29deg); 41 | -ms-transform: rotate(29deg); 42 | transform: rotate(29deg); 43 | } 44 | 45 | .star4 46 | { 47 | top: 25px; 48 | left: 215px; 49 | -webkit-transform: rotate(45deg); 50 | -ms-transform: rotate(45deg); 51 | transform: rotate(45deg); 52 | } 53 | 54 | .star5 55 | { 56 | top: 28px; 57 | left: 217px; 58 | -webkit-transform: rotate(61deg); 59 | -ms-transform: rotate(61deg); 60 | transform: rotate(61deg); 61 | } 62 | 63 | .star6 64 | { 65 | top: 32px; 66 | left: 217px; 67 | -webkit-transform: rotate(76deg); 68 | -ms-transform: rotate(76deg); 69 | transform: rotate(76deg); 70 | } 71 | 72 | .star7 73 | { 74 | top: 35px; 75 | left: 217px; 76 | -webkit-transform: rotate(87deg); 77 | -ms-transform: rotate(87deg); 78 | transform: rotate(87deg); 79 | } 80 | 81 | .star8 82 | { 83 | top: 39px; 84 | left: 217px; 85 | -webkit-transform: rotate(104deg); 86 | -ms-transform: rotate(104deg); 87 | transform: rotate(104deg); 88 | } 89 | 90 | .star9 91 | { 92 | top: 43px; 93 | left: 217px; 94 | -webkit-transform: rotate(120deg); 95 | -ms-transform: rotate(120deg); 96 | transform: rotate(120deg); 97 | } 98 | 99 | .star10 100 | { 101 | top: 47px; 102 | left: 216px; 103 | -webkit-transform: rotate(135deg); 104 | -ms-transform: rotate(135deg); 105 | transform: rotate(135deg); 106 | } 107 | 108 | .star11 109 | { 110 | top: 49px; 111 | left: 212px; 112 | -webkit-transform: rotate(150deg); 113 | -ms-transform: rotate(150deg); 114 | transform: rotate(150deg); 115 | } 116 | 117 | .star12 118 | { 119 | top: 50px; 120 | left: 208px; 121 | -webkit-transform: rotate(165deg); 122 | -ms-transform: rotate(165deg); 123 | transform: rotate(165deg); 124 | } 125 | 126 | .star13 127 | { 128 | top: 51px; 129 | left: 204px; 130 | -webkit-transform: rotate(180deg); 131 | -ms-transform: rotate(180deg); 132 | transform: rotate(180deg); 133 | } 134 | 135 | .star14 136 | { 137 | top: 50px; 138 | left: 200px; 139 | -webkit-transform: rotate(195deg); 140 | -ms-transform: rotate(195deg); 141 | transform: rotate(195deg); 142 | } 143 | 144 | .star15 145 | { 146 | top: 50px; 147 | left: 196px; 148 | -webkit-transform: rotate(210deg); 149 | -ms-transform: rotate(210deg); 150 | transform: rotate(210deg); 151 | } 152 | 153 | .star16 154 | { 155 | top: 47px; 156 | left: 193px; 157 | -webkit-transform: rotate(225deg); 158 | -ms-transform: rotate(225deg); 159 | transform: rotate(225deg); 160 | } 161 | 162 | .star17 163 | { 164 | top: 44px; 165 | left: 190px; 166 | -webkit-transform: rotate(240deg); 167 | -ms-transform: rotate(240deg); 168 | transform: rotate(240deg); 169 | } 170 | 171 | .star18 172 | { 173 | top: 40px; 174 | left: 189px; 175 | -webkit-transform: rotate(255deg); 176 | -ms-transform: rotate(255deg); 177 | transform: rotate(255deg); 178 | } 179 | 180 | .star19 181 | { 182 | top: 36px; 183 | left: 188px; 184 | -webkit-transform: rotate(270deg); 185 | -ms-transform: rotate(270deg); 186 | transform: rotate(270deg); 187 | } 188 | 189 | .star20 190 | { 191 | top: 31px; 192 | left: 188px; 193 | -webkit-transform: rotate(285deg); 194 | -ms-transform: rotate(285deg); 195 | transform: rotate(285deg); 196 | } 197 | 198 | .star21 199 | { 200 | top: 27px; 201 | left: 190px; 202 | -webkit-transform: rotate(300deg); 203 | -ms-transform: rotate(300deg); 204 | transform: rotate(300deg); 205 | } 206 | 207 | .star22 208 | { 209 | top: 24px; 210 | left: 193px; 211 | -webkit-transform: rotate(315deg); 212 | -ms-transform: rotate(315deg); 213 | transform: rotate(315deg); 214 | } 215 | 216 | .star23 217 | { 218 | top: 21px; 219 | left: 196px; 220 | -webkit-transform: rotate(330deg); 221 | -ms-transform: rotate(330deg); 222 | transform: rotate(330deg); 223 | } 224 | 225 | .star24 226 | { 227 | top: 20px; 228 | left: 200px; 229 | -webkit-transform: rotate(345deg); 230 | -ms-transform: rotate(345deg); 231 | transform: rotate(345deg); 232 | } 233 | 234 | .star-outer 235 | { 236 | top: 34px; 237 | left: 196px; 238 | width: 19px; 239 | height: 19px; 240 | background: #e5be01; 241 | border-radius: 50%; 242 | } 243 | 244 | .star-middle 245 | { 246 | top: 1px; 247 | left: 1px; 248 | width: 17px; 249 | height: 17px; 250 | background: #00a1de; 251 | border-radius: 50%; 252 | } 253 | 254 | .star-inner 255 | { 256 | top: 1px; 257 | left: 1px; 258 | width: 15px; 259 | height: 15px; 260 | background: #e5be01; 261 | border-radius: 50%; 262 | } 263 | } -------------------------------------------------------------------------------- /flags/less/south-korea.less: -------------------------------------------------------------------------------- 1 | #south-korea { 2 | position: relative; 3 | background: #ffffff; 4 | width: 225px; 5 | height: 150px; 6 | 7 | .yinyang { 8 | position: relative; 9 | top: 37px; 10 | left: 74px; 11 | width: 76px; 12 | height: 41px; 13 | background: #c60c30; 14 | border-bottom: 35px solid #003478; 15 | border-radius: 50%; 16 | 17 | &:before { 18 | content: ""; 19 | position: absolute; 20 | top: 50%; 21 | left: 0; 22 | width: 39px; 23 | height: 30px; 24 | background: #c60c30; 25 | border-radius: 50%; 26 | } 27 | 28 | &.yinyang:after { 29 | content: ""; 30 | position: absolute; 31 | top: 66%; 32 | left: 50%; 33 | width: 38px; 34 | height: 30px; 35 | background: #003478; 36 | border-radius: 50%; 37 | } 38 | } 39 | 40 | .stripes { 41 | height: 25px; 42 | width: 39px; 43 | 44 | &.stripes1 { 45 | top: 24px; 46 | left: 36px; 47 | background-image: linear-gradient(#000000 22%, #ffffff 22%, #ffffff 39%, #000000 39%, #000000 61%, #ffffff 61%, #ffffff 78%, #000000 78%);; 48 | transform: rotate(-56deg); 49 | } 50 | 51 | &.stripes2 { 52 | top: 24px; 53 | left: 150px; 54 | background-image: linear-gradient(#ffffff 25%, transparent 25%, transparent 75%, #ffffff 75%), linear-gradient(#000000 22%, #ffffff 22%, #ffffff 39%, #000000 39%, #000000 61%, #ffffff 61%, #ffffff 78%, #000000 78%);; 55 | background-size: 16% 100%; 56 | background-position: 50% 0, 0 0; 57 | background-repeat: no-repeat, repeat; 58 | transform: rotate(56deg); 59 | } 60 | 61 | &.stripes3 { 62 | top: 101px; 63 | left: 36px; 64 | background-image: linear-gradient(90deg, transparent 43%, #ffffff 43%, #ffffff 57%, transparent 57%), linear-gradient(#000000 22%, #ffffff 22%, #ffffff 39%, #000000 39%, #000000 61%, #ffffff 61%, #ffffff 78%, #000000 78%);; 65 | background-size: 39px 11px, 39px 25px; 66 | background-position: 0 7px, 0 0; 67 | background-repeat: no-repeat, repeat; 68 | transform: rotate(56deg); 69 | } 70 | 71 | &.stripes4 { 72 | top: 101px; 73 | left: 150px; 74 | background-image: linear-gradient(90deg, transparent 43%, #ffffff 43%, #ffffff 57%, transparent 57%), linear-gradient(#000000 22%, #ffffff 22%, #ffffff 39%, #000000 39%, #000000 61%, #ffffff 61%, #ffffff 78%, #000000 78%);; 75 | transform: rotate(-56deg); 76 | } 77 | } 78 | } -------------------------------------------------------------------------------- /flags/less/styles.less: -------------------------------------------------------------------------------- 1 | html, body 2 | { 3 | height: 100%; 4 | } 5 | 6 | #wrap 7 | { 8 | min-height: 100%; 9 | height: auto !important; 10 | height: 100%; 11 | margin: 0 auto -60px; 12 | } 13 | 14 | #push, #footer 15 | { 16 | height: 60px; 17 | } 18 | 19 | #footer 20 | { 21 | background-color: #f5f5f5; 22 | } 23 | 24 | 25 | @media (max-width: 767px) 26 | { 27 | #footer 28 | { 29 | margin-left: -20px; 30 | margin-right: -20px; 31 | padding-left: 20px; 32 | padding-right: 20px; 33 | } 34 | } -------------------------------------------------------------------------------- /flags/less/tanzania.less: -------------------------------------------------------------------------------- 1 | #tanzania 2 | { 3 | background-image: -webkit-linear-gradient(147deg, #1eb53a 39%, #fcd116 39%, #fcd116 43%, #000000 43%, #000000 57%, #fcd116 57%, #fcd116 61%, #00a3dd 61%); 4 | background-image: -o-linear-gradient(147deg, #1eb53a 39%, #fcd116 39%, #fcd116 43%, #000000 43%, #000000 57%, #fcd116 57%, #fcd116 61%, #00a3dd 61%); 5 | background-image: -moz-linear-gradient(147deg, #1eb53a 39%, #fcd116 39%, #fcd116 43%, #000000 43%, #000000 57%, #fcd116 57%, #fcd116 61%, #00a3dd 61%); 6 | background-image: linear-gradient(147deg, #1eb53a 39%, #fcd116 39%, #fcd116 43%, #000000 43%, #000000 57%, #fcd116 57%, #fcd116 61%, #00a3dd 61%); 7 | width: 225px; 8 | height: 150px; 9 | } -------------------------------------------------------------------------------- /flags/less/tunisia.less: -------------------------------------------------------------------------------- 1 | #tunisia { 2 | position: relative; 3 | background: #e70013; 4 | width: 225px; 5 | height: 150px; 6 | 7 | .middle { 8 | display: block; 9 | width: 73px; 10 | top: 38px; 11 | left: 76px; 12 | height: 73px; 13 | background: #ffffff; 14 | border-radius: 50%; 15 | } 16 | 17 | .moon { 18 | display: block; 19 | width: 55px; 20 | top: 9px; 21 | left: 9px; 22 | height: 55px; 23 | background: #e70013; 24 | border-radius: 50%; 25 | } 26 | 27 | .moon-clip 28 | { 29 | display: block; 30 | width: 45px; 31 | top: 14px; 32 | left: 22px; 33 | height: 45px; 34 | background: #ffffff; 35 | border-radius: 50%; 36 | } 37 | } -------------------------------------------------------------------------------- /flags/less/united-kingdom.less: -------------------------------------------------------------------------------- 1 | #united-kingdom 2 | { 3 | background-color: #00247d; 4 | background-image: linear-gradient(#cf142b 30px, transparent 30px), linear-gradient(90deg, #cf142b 30px, transparent 30px), 5 | linear-gradient(#ffffff 50px, transparent 50px), linear-gradient(90deg, #ffffff 50px, transparent 50px), 6 | linear-gradient(25deg, transparent 35px, #cf142b 35px, #cf142b 45px, transparent 45px), linear-gradient(25deg, transparent 30px, #ffffff 30px, #ffffff 55px, transparent 55px), 7 | linear-gradient(-25deg, transparent 45px, #cf142b 45px, #cf142b 55px, transparent 55px), linear-gradient(-25deg, transparent 35px, #ffffff 35px, #ffffff 60px, transparent 60px), 8 | linear-gradient(-25deg, transparent 45px, #cf142b 45px, #cf142b 55px, transparent 55px), linear-gradient(-25deg, transparent 40px, #ffffff 40px, #ffffff 65px, transparent 65px), 9 | linear-gradient(25deg, transparent 55px, #cf142b 55px, #cf142b 65px, transparent 65px), linear-gradient(25deg, transparent 45px, #ffffff 45px, #ffffff 70px, transparent 70px); 10 | background-size: 300px 90px, 165px 150px, 300px 100px, 175px 150px, 125px 50px, 125px 50px, 125px 50px, 125px 50px, 125px 50px, 125px 50px, 125px 50px, 125px 50px; 11 | background-position: 0 -30px, -30px 0, 0 -50px, -50px 0, 0 0, 0 0, 175px 0, 175px 0, 0 100px, 0 100px, 175px 100px, 175px 100px; 12 | background-repeat: repeat, repeat, repeat, repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat, no-repeat; 13 | width: 300px; 14 | height: 150px; 15 | } -------------------------------------------------------------------------------- /flags/less/usa.less: -------------------------------------------------------------------------------- 1 | #usa 2 | { 3 | position: relative; 4 | background-image: -webkit-linear-gradient(90deg, #3c3b6e 40%, transparent 40%), linear-gradient(#b22234 50%, #ffffff 50%); 5 | background-image: -o-linear-gradient(90deg, #3c3b6e 40%, transparent 40%), linear-gradient(#b22234 50%, #ffffff 50%); 6 | background-image: -moz-linear-gradient(90deg, #3c3b6e 40%, transparent 40%), linear-gradient(#b22234 50%, #ffffff 50%); 7 | background-image: linear-gradient(90deg, #3c3b6e 40%, transparent 40%), linear-gradient(#b22234 50%, #ffffff 50%); 8 | background-size: 300px 84px, 300px 24px; 9 | background-repeat: no-repeat, repeat-y; 10 | width: 300px; 11 | height: 158px; 12 | 13 | star { 14 | display: block; 15 | width: 0px; 16 | height: 0px; 17 | border-right: 50px solid transparent; 18 | border-bottom: 35px solid #ffffff; 19 | border-left: 50px solid transparent; 20 | -moz-transform: rotate(35deg) scale(0.08, 0.08); 21 | -webkit-transform: rotate(35deg) scale(0.08, 0.08); 22 | -ms-transform: rotate(35deg) scale(0.08, 0.08); 23 | -o-transform: rotate(35deg) scale(0.08, 0.08); 24 | 25 | &:before { 26 | content: ''; 27 | display: block; 28 | position: absolute; 29 | top: -22.5px; 30 | left: -32.5px; 31 | height: 0; 32 | width: 0; 33 | border-bottom: 40px solid #ffffff; 34 | border-left: 15px solid transparent; 35 | border-right: 15px solid transparent; 36 | -webkit-transform: rotate(-35deg); 37 | -moz-transform: rotate(-35deg); 38 | -ms-transform: rotate(-35deg); 39 | -o-transform: rotate(-35deg); 40 | } 41 | 42 | &:after { 43 | content: ''; 44 | display: block; 45 | position: absolute; 46 | top: 3px; 47 | left: -52.5px; 48 | width: 0px; 49 | height: 0px; 50 | border-right: 50px solid transparent; 51 | border-bottom: 35px solid #ffffff; 52 | border-left: 50px solid transparent; 53 | -webkit-transform: rotate(-70deg); 54 | -moz-transform: rotate(-70deg); 55 | -ms-transform: rotate(-70deg); 56 | -o-transform: rotate(-70deg); 57 | } 58 | } 59 | 60 | .star1 { 61 | top: -9px; 62 | left: -40px; 63 | } 64 | 65 | .star2 { 66 | top: -9px; 67 | left: -20px; 68 | } 69 | 70 | .star3 { 71 | top: -9px; 72 | left: 0; 73 | } 74 | 75 | .star4 { 76 | top: -9px; 77 | left: 20px; 78 | } 79 | 80 | .star5 { 81 | top: -9px; 82 | left: 40px; 83 | } 84 | 85 | .star6 { 86 | top: -9px; 87 | left: 60px; 88 | } 89 | 90 | .star7 { 91 | top: -1px; 92 | left: -30px; 93 | } 94 | 95 | .star8 { 96 | top: -1px; 97 | left: -10px; 98 | } 99 | 100 | .star9 { 101 | top: -1px; 102 | left: 10px; 103 | } 104 | 105 | .star10 { 106 | top: -1px; 107 | left: 30px; 108 | } 109 | 110 | .star11 { 111 | top: -1px; 112 | left: 50px; 113 | } 114 | 115 | .star12 { 116 | top: 8px; 117 | left: -40px; 118 | } 119 | 120 | .star13 { 121 | top: 8px; 122 | left: -20px; 123 | } 124 | 125 | .star14 { 126 | top: 8px; 127 | left: 0; 128 | } 129 | 130 | .star15 { 131 | top: 8px; 132 | left: 20px; 133 | } 134 | 135 | .star16 { 136 | top: 8px; 137 | left: 40px; 138 | } 139 | 140 | .star17 { 141 | top: 8px; 142 | left: 60px; 143 | } 144 | 145 | .star18 { 146 | top: 16px; 147 | left: -30px; 148 | } 149 | 150 | .star19 { 151 | top: 16px; 152 | left: -10px; 153 | } 154 | 155 | .star20 { 156 | top: 16px; 157 | left: 10px; 158 | } 159 | 160 | .star21 { 161 | top: 16px; 162 | left: 30px; 163 | } 164 | 165 | .star22 { 166 | top: 16px; 167 | left: 50px; 168 | } 169 | 170 | .star23 { 171 | top: 25px; 172 | left: -40px; 173 | } 174 | 175 | .star24 { 176 | top: 25px; 177 | left: -20px; 178 | } 179 | 180 | .star25 { 181 | top: 25px; 182 | left: 0; 183 | } 184 | 185 | .star26 { 186 | top: 25px; 187 | left: 20px; 188 | } 189 | 190 | .star27 { 191 | top: 25px; 192 | left: 40px; 193 | } 194 | 195 | .star28 { 196 | top: 25px; 197 | left: 60px; 198 | } 199 | 200 | .star29 { 201 | top: 34px; 202 | left: -30px; 203 | } 204 | 205 | .star30 { 206 | top: 34px; 207 | left: -10px; 208 | } 209 | 210 | .star31 { 211 | top: 34px; 212 | left: 10px; 213 | } 214 | 215 | .star32 { 216 | top: 34px; 217 | left: 30px; 218 | } 219 | 220 | .star33 { 221 | top: 34px; 222 | left: 50px; 223 | } 224 | 225 | .star34 { 226 | top: 42px; 227 | left:-40px; 228 | } 229 | 230 | .star35 { 231 | top: 42px; 232 | left: -20px; 233 | } 234 | 235 | .star36 { 236 | top: 42px; 237 | left: 0; 238 | } 239 | 240 | .star37 { 241 | top: 42px; 242 | left: 20px; 243 | } 244 | 245 | .star38 { 246 | top: 42px; 247 | left: 40px; 248 | } 249 | 250 | .star39 { 251 | top: 42px; 252 | left: 60px; 253 | } 254 | 255 | .star40 { 256 | top: 51px; 257 | left: -30px; 258 | } 259 | 260 | .star41 { 261 | top: 51px; 262 | left: -10px; 263 | } 264 | 265 | .star42 { 266 | top: 51px; 267 | left: 10px; 268 | } 269 | 270 | .star43 { 271 | top: 51px; 272 | left: 30px; 273 | } 274 | 275 | .star44 { 276 | top: 51px; 277 | left: 50px; 278 | } 279 | 280 | .star45 { 281 | top: 59px; 282 | left: -40px; 283 | } 284 | 285 | .star46 { 286 | top: 59px; 287 | left: -20px; 288 | } 289 | 290 | .star47 { 291 | top: 59px; 292 | left: 0; 293 | } 294 | 295 | .star48 { 296 | top: 59px; 297 | left: 20px; 298 | } 299 | 300 | .star49 { 301 | top: 59px; 302 | left: 40px; 303 | } 304 | 305 | .star50 { 306 | top: 59px; 307 | left: 60px; 308 | } 309 | } -------------------------------------------------------------------------------- /flags/less/vietnam.less: -------------------------------------------------------------------------------- 1 | #vietnam { 2 | position: relative; 3 | background-color: #da251d; 4 | width: 225px; 5 | height: 150px; 6 | 7 | .star { 8 | display: block; 9 | position: absolute; 10 | top: 56px; 11 | left: 64px; 12 | width: 0px; 13 | height: 0px; 14 | border-right: 50px solid transparent; 15 | border-bottom: 35px solid #ffff00; 16 | border-left: 50px solid transparent; 17 | -moz-transform: rotate(36deg) scale(0.9, 0.9); 18 | -webkit-transform: rotate(36deg) scale(0.9, 0.9); 19 | -ms-transform: rotate(36deg) scale(0.9, 0.9); 20 | -o-transform: rotate(36deg) scale(0.9, 0.9); 21 | 22 | &:before { 23 | content: ''; 24 | display: block; 25 | position: absolute; 26 | top: -23.5px; 27 | left: -32.5px; 28 | height: 0; 29 | width: 0; 30 | border-bottom: 40px solid #ffff00; 31 | border-left: 15px solid transparent; 32 | border-right: 15px solid transparent; 33 | -webkit-transform: rotate(-35deg); 34 | -moz-transform: rotate(-35deg); 35 | -ms-transform: rotate(-35deg); 36 | -o-transform: rotate(-35deg); 37 | } 38 | 39 | &:after { 40 | content: ''; 41 | display: block; 42 | position: absolute; 43 | top: 3px; 44 | left: -52.5px; 45 | width: 0px; 46 | height: 0px; 47 | border-right: 50px solid transparent; 48 | border-bottom: 35px solid #ffff00; 49 | border-left: 50px solid transparent; 50 | -webkit-transform: rotate(-72deg); 51 | -moz-transform: rotate(-72deg); 52 | -ms-transform: rotate(-72deg); 53 | -o-transform: rotate(-72deg); 54 | } 55 | } 56 | } 57 | -------------------------------------------------------------------------------- /flags/less/yemen.less: -------------------------------------------------------------------------------- 1 | #yemen { 2 | background-image: -webkit-linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 66%, #000000 66%); 3 | background-image: -moz-linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 66%, #000000 66%); 4 | background-image: -o-linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 66%, #000000 66%); 5 | background-image: linear-gradient(#ce1126 33%, #ffffff 33%, #ffffff 66%, #000000 66%); 6 | width: 225px; 7 | height: 150px; 8 | } -------------------------------------------------------------------------------- /flags/north-korea.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | North Korea 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/norway.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Norway 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/philippines.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Philippines 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 | -------------------------------------------------------------------------------- /flags/republic-of-the-congo.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Republic of the Congo 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/romania.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Romania 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/rwanda.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Rwanda 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 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 | 50 | 51 | -------------------------------------------------------------------------------- /flags/south-korea.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | South Korea 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 |
25 | 26 | 27 | -------------------------------------------------------------------------------- /flags/tanzania.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Tanzania 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/tunisia.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Tunisia 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 |
22 |
23 |
24 | 25 | 26 | -------------------------------------------------------------------------------- /flags/united-kingdom.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | United Kingdom 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /flags/usa.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | United States of America 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 |
39 |
40 |
41 |
42 |
43 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
53 |
54 |
55 |
56 |
57 |
58 |
59 |
60 |
61 |
62 |
63 |
64 |
65 |
66 |
67 |
68 |
69 |
70 | 71 | 72 | -------------------------------------------------------------------------------- /flags/vietnam.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Vietnam 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 |
20 |
21 | 22 | 23 | -------------------------------------------------------------------------------- /flags/yemen.html: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | Yemen 10 | 11 | 12 | 13 | 14 | 15 | 16 | 17 | 18 |
19 | 20 | 21 | -------------------------------------------------------------------------------- /package.json: -------------------------------------------------------------------------------- 1 | { 2 | "name": "Flags-in-CSS", 3 | "version": "0.1.0", 4 | "devDependencies": { 5 | "grunt": "~0.4.5", 6 | "grunt-contrib-less": "~0.12.0" 7 | } 8 | } 9 | --------------------------------------------------------------------------------