Khác biệt giữa các bản “Bản mẫu:BKTT:Toàn bộ/styles.css”
 
(Không hiển thị 39 phiên bản của cùng người dùng ở giữa)
Dòng 3: Dòng 3:
 
     flex-wrap: wrap;
 
     flex-wrap: wrap;
 
}
 
}
 +
 +
.group-layout .group {
 +
    flex: 0 0 calc(25% - 15px);
 +
    margin-top: 20px;
 +
}
 +
 +
.group-layout .group:nth-child(4n+1) {
 +
    margin-right: 20px;
 +
}
 +
.group-layout .group:nth-child(4n+2) {
 +
    margin-right: 20px;
 +
}
 +
.group-layout .group:nth-child(4n+3) {
 +
    margin-right: 20px;
 +
}
 +
 +
@media only screen and (max-width: 1650px) {
  
 
.group-layout .group {
 
.group-layout .group {
Dòng 8: Dòng 25:
 
     margin-top: 20px;
 
     margin-top: 20px;
 
}
 
}
−
 
+
.group-layout .group:nth-child(4n+1) {
 +
    margin-right: 0px;
 +
}
 +
.group-layout .group:nth-child(4n+2) {
 +
    margin-right: 0px;
 +
}
 +
.group-layout .group:nth-child(4n+3) {
 +
    margin-right: 0px;
 +
}
 
.group-layout .group:nth-child(3n+1) {
 
.group-layout .group:nth-child(3n+1) {
 
     margin-right: 20px;
 
     margin-right: 20px;
Dòng 16: Dòng 41:
 
}
 
}
  
−
@media only screen and (max-width: 1500px) {
+
}
 +
 
 +
@media only screen and (max-width: 1100px) {
  
 
   .group-layout .group {
 
   .group-layout .group {
Dòng 33: Dòng 60:
 
}
 
}
  
−
@media only screen and (max-width: 850px) {
+
@media only screen and (max-width: 550px) {
  
 
     .group-layout .group {
 
     .group-layout .group {
Dòng 50: Dòng 77:
 
}
 
}
  
−
.p1 {padding-left: 10px;}
+
.p1 {padding: 0px 10px 0px 10px;}
−
.p2 {color:white;text-align: justify;padding-left: 10px;padding-right: 16px;}
+
.p2 {padding-left: 10px;line-height:80%;}
−
 
 
 
.q1 {
 
.q1 {
−
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/9/92/Isotoxal_octagon_rhombic_dissection.jpg);
+
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Isotoxal_octagon_rhombic_dissection.jpg/480px-Isotoxal_octagon_rhombic_dissection.jpg);
 
     background-size: cover;
 
     background-size: cover;
 
     width: 100%;
 
     width: 100%;
Dòng 60: Dòng 86:
 
     position: relative;  
 
     position: relative;  
 
}
 
}
−
 
 
.q2 {
 
.q2 {
−
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/e/ea/CSIRO_ScienceImage_2212_CSIRO_Parkes_Telescope_This_photo_taken_in_1969_shows_the_telescope_as_it_was_around_the_time_of_the_first_manned_Moon_landing.jpg);
+
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/CSIRO_ScienceImage_2212_CSIRO_Parkes_Telescope_This_photo_taken_in_1969_shows_the_telescope_as_it_was_around_the_time_of_the_first_manned_Moon_landing.jpg/504px-CSIRO_ScienceImage_2212_CSIRO_Parkes_Telescope_This_photo_taken_in_1969_shows_the_telescope_as_it_was_around_the_time_of_the_first_manned_Moon_landing.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q3 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Aerogel_nasa.jpg/479px-Aerogel_nasa.jpg);
 
     background-size: cover;
 
     background-size: cover;
 
     width: 100%;
 
     width: 100%;
Dòng 68: Dòng 100:
 
     position: relative;  
 
     position: relative;  
 
}
 
}
−
 
+
.q4 {
−
.qN {
+
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/5/54/Gabelschwanz%2C_Raupe_in_Schreckstellung_im_Geo-Naturpark_Bergstraße-Odenwald.jpg/480px-Gabelschwanz%2C_Raupe_in_Schreckstellung_im_Geo-Naturpark_Bergstraße-Odenwald.jpg);
−
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/d/d7/Silver_square.svg);
+
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q5 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ef/Aragonite_crystal_-_Los_Molinillos%2C_Ceunca%2C_Spain_-_4x3.6x3.5cm_100g.jpg/480px-Aragonite_crystal_-_Los_Molinillos%2C_Ceunca%2C_Spain_-_4x3.6x3.5cm_100g.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q6 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ee/Part_of_the_world_%288483222118%29.jpg/600px-Part_of_the_world_%288483222118%29.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q7 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Vietnam%27s_Mekong_Delta_ESA219993.jpg/493px-Vietnam%27s_Mekong_Delta_ESA219993.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q8 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/Amdahl_5860_Computer_Air_Cooled_Logic_processor_die.jpg/480px-Amdahl_5860_Computer_Air_Cooled_Logic_processor_die.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q9 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Hydroponic_Farming.jpg/480px-Hydroponic_Farming.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q10 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/Gordon_River%2C_Franklin-Gordon_Wild_Rivers_National_Park_--_user_aliceae.jpg/480px-Gordon_River%2C_Franklin-Gordon_Wild_Rivers_National_Park_--_user_aliceae.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q11 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/a/a2/Hawksbill_turtle_at_Elphinstone_Reef%2C_Red_Sea%2C_Egypt_%2836522421716%29.jpg/480px-Hawksbill_turtle_at_Elphinstone_Reef%2C_Red_Sea%2C_Egypt_%2836522421716%29.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q12 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Ritalin-SR-20mg-1000x1000.jpg/480px-Ritalin-SR-20mg-1000x1000.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q13 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/6/6f/Arduino_Due_Circuit_Board.jpg/480px-Arduino_Due_Circuit_Board.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q14 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ee/Chartist_Bridge_%28detail%29_-_geograph.org.uk_-_871813.jpg/480px-Chartist_Bridge_%28detail%29_-_geograph.org.uk_-_871813.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q15 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/7/74/Cyprus_airways_a330-200_5b-dbs_arp.jpg/480px-Cyprus_airways_a330-200_5b-dbs_arp.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q16 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/3/3b/11-09-fotofluege-cux-allg-25a.jpg/480px-11-09-fotofluege-cux-allg-25a.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q17 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/1/14/Antron_Fleece.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q18 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/1/1c/Fountain_pen_writing_%28literacy%29_%28cropped%29.jpg/480px-Fountain_pen_writing_%28literacy%29_%28cropped%29.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q19 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/ce/Caligraphy.jpg/489px-Caligraphy.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q20 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/a/ac/Mooncakes_in_Malaysia.jpg/481px-Mooncakes_in_Malaysia.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q21 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/3/3c/Dragon_Makara_%28Culture_Cham%2C_Musée_Guimet%29_%285174382704%29.jpg/480px-Dragon_Makara_%28Culture_Cham%2C_Musée_Guimet%29_%285174382704%29.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q22 {
 +
     background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/d/d2/Moáis.jpg/480px-Moáis.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q23 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/2b/Krapina_3._Homo_neanderthalensis.jpg/480px-Krapina_3._Homo_neanderthalensis.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q24 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/3/31/Inflations_-_Hungarian_paper_money_1946.jpg/480px-Inflations_-_Hungarian_paper_money_1946.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q25 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/3/3c/L%E1%BB%A3n_ti%E1%BA%BFt_ki%E1%BB%87m.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q26 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/80/思想者塑像.JPG/480px-思想者塑像.JPG);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q27 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Travel-Burma-yangon-shwedagon-pagoda_cropped.jpg/480px-Travel-Burma-yangon-shwedagon-pagoda_cropped.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q28 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/93/2013.01.26.112649_Flags_Centennial_Olympic_Park_Atlanta_Georgia.jpg/640px-2013.01.26.112649_Flags_Centennial_Olympic_Park_Atlanta_Georgia.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q29 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Duyet_binh.jpg/640px-Duyet_binh.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q30 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/c7/Judiciary_logo.jpg/532px-Judiciary_logo.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q31 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Miniature_ivory_phrenological_head%2C_Europe_Wellcome_L0057706.jpg/477px-Miniature_ivory_phrenological_head%2C_Europe_Wellcome_L0057706.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q32 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/1/17/Prunksaal_Hofbibliothek_Wien_2009_PD_20091008_047.JPG/640px-Prunksaal_Hofbibliothek_Wien_2009_PD_20091008_047.JPG);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q33 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/0/0e/Mặt_nạ%2C_rạp_Hồng_Hà%2C_Hà_Nội_001.JPG/640px-Mặt_nạ%2C_rạp_Hồng_Hà%2C_Hà_Nội_001.JPG);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q34 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/6/62/To_Ngoc_Van_thieu_nu_ben_hoa_hue.jpg/439px-To_Ngoc_Van_thieu_nu_ben_hoa_hue.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q35 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/c1/Krustenbraten_mit_Dunkelbiersoße.jpg/640px-Krustenbraten_mit_Dunkelbiersoße.jpg);
 +
    background-size: cover;
 +
    width: 100%;
 +
    padding-top: 100%;
 +
    position: relative;
 +
}
 +
.q36 {
 +
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/5-digit_Wordlock_locked_with_combination_Basin_and_hardened_shackle.jpg/478px-5-digit_Wordlock_locked_with_combination_Basin_and_hardened_shackle.jpg);
 
     background-size: cover;
 
     background-size: cover;
 
     width: 100%;
 
     width: 100%;

Bản hiện tại lúc 18:06, ngày 31 tháng 10 năm 2020

.group-layout {
    display: flex;
    flex-wrap: wrap;
}

.group-layout .group {
    flex: 0 0 calc(25% - 15px);
    margin-top: 20px;
}

.group-layout .group:nth-child(4n+1) {
    margin-right: 20px;
}
.group-layout .group:nth-child(4n+2) {
    margin-right: 20px;
}
.group-layout .group:nth-child(4n+3) {
    margin-right: 20px;
}

@media only screen and (max-width: 1650px) {

.group-layout .group {
    flex: 0 0 calc(33.33% - 13.34px);
    margin-top: 20px;
}
.group-layout .group:nth-child(4n+1) {
    margin-right: 0px;
}
.group-layout .group:nth-child(4n+2) {
    margin-right: 0px;
}
.group-layout .group:nth-child(4n+3) {
    margin-right: 0px;
}
.group-layout .group:nth-child(3n+1) {
    margin-right: 20px;
}
.group-layout .group:nth-child(3n+2) {
    margin-right: 20px;
}

}

@media only screen and (max-width: 1100px) {

   .group-layout .group {
        flex: 0 0 calc(50% - 10px);
    }
   .group-layout .group:nth-child(3n+1) {
        margin-right: 0px;
   }
   .group-layout .group:nth-child(3n+2) {
        margin-right: 0px;
   }
   .group-layout .group:nth-child(2n+1) {
        margin-right: 20px;
   }

}

@media only screen and (max-width: 550px) {

    .group-layout .group {
        flex: 0 0 100%;
    }

}

.article-text {
    padding-bottom: 6px;
    padding-left: 6px;
    position: absolute;
    bottom: 0;
    background-image: linear-gradient(rgba(0, 0, 0, 0), rgba(0, 0, 0, 1));
    width: calc(100% - 5px);
}

.p1 {padding: 0px 10px 0px 10px;}
.p2 {padding-left: 10px;line-height:80%;}
.q1 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/92/Isotoxal_octagon_rhombic_dissection.jpg/480px-Isotoxal_octagon_rhombic_dissection.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q2 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ea/CSIRO_ScienceImage_2212_CSIRO_Parkes_Telescope_This_photo_taken_in_1969_shows_the_telescope_as_it_was_around_the_time_of_the_first_manned_Moon_landing.jpg/504px-CSIRO_ScienceImage_2212_CSIRO_Parkes_Telescope_This_photo_taken_in_1969_shows_the_telescope_as_it_was_around_the_time_of_the_first_manned_Moon_landing.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q3 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/85/Aerogel_nasa.jpg/479px-Aerogel_nasa.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q4 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/5/54/Gabelschwanz%2C_Raupe_in_Schreckstellung_im_Geo-Naturpark_Bergstraße-Odenwald.jpg/480px-Gabelschwanz%2C_Raupe_in_Schreckstellung_im_Geo-Naturpark_Bergstraße-Odenwald.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q5 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ef/Aragonite_crystal_-_Los_Molinillos%2C_Ceunca%2C_Spain_-_4x3.6x3.5cm_100g.jpg/480px-Aragonite_crystal_-_Los_Molinillos%2C_Ceunca%2C_Spain_-_4x3.6x3.5cm_100g.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q6 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ee/Part_of_the_world_%288483222118%29.jpg/600px-Part_of_the_world_%288483222118%29.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q7 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/e6/Vietnam%27s_Mekong_Delta_ESA219993.jpg/493px-Vietnam%27s_Mekong_Delta_ESA219993.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q8 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/d/d5/Amdahl_5860_Computer_Air_Cooled_Logic_processor_die.jpg/480px-Amdahl_5860_Computer_Air_Cooled_Logic_processor_die.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q9 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Hydroponic_Farming.jpg/480px-Hydroponic_Farming.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q10 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/e1/Gordon_River%2C_Franklin-Gordon_Wild_Rivers_National_Park_--_user_aliceae.jpg/480px-Gordon_River%2C_Franklin-Gordon_Wild_Rivers_National_Park_--_user_aliceae.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q11 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/a/a2/Hawksbill_turtle_at_Elphinstone_Reef%2C_Red_Sea%2C_Egypt_%2836522421716%29.jpg/480px-Hawksbill_turtle_at_Elphinstone_Reef%2C_Red_Sea%2C_Egypt_%2836522421716%29.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q12 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/a/a9/Ritalin-SR-20mg-1000x1000.jpg/480px-Ritalin-SR-20mg-1000x1000.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q13 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/6/6f/Arduino_Due_Circuit_Board.jpg/480px-Arduino_Due_Circuit_Board.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q14 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/e/ee/Chartist_Bridge_%28detail%29_-_geograph.org.uk_-_871813.jpg/480px-Chartist_Bridge_%28detail%29_-_geograph.org.uk_-_871813.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q15 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/7/74/Cyprus_airways_a330-200_5b-dbs_arp.jpg/480px-Cyprus_airways_a330-200_5b-dbs_arp.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q16 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/3/3b/11-09-fotofluege-cux-allg-25a.jpg/480px-11-09-fotofluege-cux-allg-25a.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q17 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/1/14/Antron_Fleece.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q18 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/1/1c/Fountain_pen_writing_%28literacy%29_%28cropped%29.jpg/480px-Fountain_pen_writing_%28literacy%29_%28cropped%29.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q19 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/ce/Caligraphy.jpg/489px-Caligraphy.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q20 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/a/ac/Mooncakes_in_Malaysia.jpg/481px-Mooncakes_in_Malaysia.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q21 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/3/3c/Dragon_Makara_%28Culture_Cham%2C_Musée_Guimet%29_%285174382704%29.jpg/480px-Dragon_Makara_%28Culture_Cham%2C_Musée_Guimet%29_%285174382704%29.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q22 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/d/d2/Moáis.jpg/480px-Moáis.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q23 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/2b/Krapina_3._Homo_neanderthalensis.jpg/480px-Krapina_3._Homo_neanderthalensis.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q24 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/3/31/Inflations_-_Hungarian_paper_money_1946.jpg/480px-Inflations_-_Hungarian_paper_money_1946.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q25 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/3/3c/L%E1%BB%A3n_ti%E1%BA%BFt_ki%E1%BB%87m.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q26 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/8/80/思想者塑像.JPG/480px-思想者塑像.JPG);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q27 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/9f/Travel-Burma-yangon-shwedagon-pagoda_cropped.jpg/480px-Travel-Burma-yangon-shwedagon-pagoda_cropped.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q28 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/93/2013.01.26.112649_Flags_Centennial_Olympic_Park_Atlanta_Georgia.jpg/640px-2013.01.26.112649_Flags_Centennial_Olympic_Park_Atlanta_Georgia.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q29 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/2/29/Duyet_binh.jpg/640px-Duyet_binh.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q30 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/c7/Judiciary_logo.jpg/532px-Judiciary_logo.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q31 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/4/4c/Miniature_ivory_phrenological_head%2C_Europe_Wellcome_L0057706.jpg/477px-Miniature_ivory_phrenological_head%2C_Europe_Wellcome_L0057706.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q32 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/1/17/Prunksaal_Hofbibliothek_Wien_2009_PD_20091008_047.JPG/640px-Prunksaal_Hofbibliothek_Wien_2009_PD_20091008_047.JPG);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q33 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/0/0e/Mặt_nạ%2C_rạp_Hồng_Hà%2C_Hà_Nội_001.JPG/640px-Mặt_nạ%2C_rạp_Hồng_Hà%2C_Hà_Nội_001.JPG);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q34 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/6/62/To_Ngoc_Van_thieu_nu_ben_hoa_hue.jpg/439px-To_Ngoc_Van_thieu_nu_ben_hoa_hue.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q35 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/c/c1/Krustenbraten_mit_Dunkelbiersoße.jpg/640px-Krustenbraten_mit_Dunkelbiersoße.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
.q36 {
    background-image: url(https://upload.wikimedia.org/wikipedia/commons/thumb/9/9e/5-digit_Wordlock_locked_with_combination_Basin_and_hardened_shackle.jpg/478px-5-digit_Wordlock_locked_with_combination_Basin_and_hardened_shackle.jpg);
    background-size: cover;
    width: 100%;
    padding-top: 100%; 
    position: relative; 
}
Lấy từ “https://bktt.vn/index.php?title=Bản_mẫu:BKTT:Toàn_bộ/styles.css&oldid=6479”