Медиа-запросы взаимодействия

<?xml version="1.0" encoding="UTF-8"?> <svg width="800px" height="800px" viewBox="0 0 73 73" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink"> <title>the-modern-web/interaction-media-queries</title> <desc>Created with Sketch.</desc> <defs> </defs> <g id="the-modern-web/interaction-media-queries" stroke="none" stroke-width="1" fill="none" fill-rule="evenodd"> <g id="container" transform="translate(2.000000, 2.000000)" fill="#FFFFFF" fill-rule="nonzero" stroke="#24353E" stroke-width="2"> <rect id="mask" x="-1" y="-1" width="71" height="71" rx="14"> </rect> </g> <g id="click" transform="translate(15.000000, 11.000000)" fill-rule="nonzero"> <path d="M41.5731578,35.8453045 L18.5322375,16.9936692 C18.0840203,16.6281242 17.424213,16.6951849 17.058668,17.1434022 C16.9064804,17.330053 16.823219,17.5634402 16.8230226,17.8042895 L16.8230226,49.2236816 C16.8225317,49.6854485 17.1246488,50.0931151 17.5665822,50.2270403 C17.6650623,50.2566923 17.7674699,50.2715184 17.8702702,50.2710274 C18.2205964,50.2708311 18.5475545,50.0955698 18.7416674,49.8039585 L26.8102655,37.7032706 L40.9112887,37.7032706 C41.4897001,37.7025833 41.9580454,37.2331579 41.9573581,36.6547466 C41.9569653,36.3410436 41.8159708,36.0439339 41.5731578,35.8453045 Z" id="Shape" fill="#2196F3"> </path> <g id="Group" fill="#455A64"> <path d="M17.8703684,10.4731634 C17.291957,10.4731634 16.8230226,10.004229 16.8230226,9.42581764 L16.8230226,1.0473458 C16.8231208,0.468934428 17.291957,0 17.8703684,0 C18.4487798,0 18.9177142,0.468934428 18.9177142,1.0473458 L18.9177142,9.42581764 C18.9177142,10.004229 18.4487798,10.4731634 17.8703684,10.4731634 Z" id="Shape"> </path> <path d="M9.49189655,18.8516353 L1.11342471,18.8516353 C0.535013337,18.8516353 0.0660789091,18.3827009 0.0660789091,17.8042895 C0.0660789091,17.2258781 0.535013337,16.7569437 1.11342471,16.7569437 L9.49189655,16.7569437 C10.0703079,16.7569437 10.5392424,17.2258781 10.5392424,17.8042895 C10.5392424,18.3827009 10.0703079,18.8516353 9.49189655,18.8516353 Z" id="Shape"> </path> <path d="M34.6274103,18.8516353 L26.2489384,18.8516353 C25.6705271,18.8516353 25.2015926,18.3827009 25.2015926,17.8042895 C25.2015926,17.2258781 25.6705271,16.7569437 26.2489384,16.7569437 L34.6274103,16.7569437 C35.2058216,16.7569437 35.6747561,17.2258781 35.6747561,17.8042895 C35.6747561,18.3827009 35.2058216,18.8516353 34.6274103,18.8516353 Z" id="Shape"> </path> <path d="M11.9468311,12.9279998 C11.6688677,12.9284908 11.4020974,12.8185229 11.2053335,12.6221517 L5.27963611,6.70283639 C4.86833663,6.29153691 4.86833663,5.62485668 5.27963611,5.2135572 C5.69093559,4.80225772 6.35761582,4.80225772 6.7689153,5.2135572 L12.6862669,11.1392546 C13.095799,11.5477067 13.0965845,12.2108522 12.6881324,12.6203843 C12.4911721,12.8178356 12.2236163,12.9285889 11.9447692,12.928098 L11.9468311,12.928098 L11.9468311,12.9279998 Z" id="Shape"> </path> <path d="M6.02113376,30.7009681 C5.44272239,30.7020482 4.97300248,30.2338992 4.97192244,29.6554878 C4.97143151,29.3766407 5.08218487,29.109085 5.27963611,28.9121247 L11.2053335,22.9864273 C11.6213459,22.5846518 12.2843932,22.5961395 12.6862669,23.0121519 C13.0782238,23.4180512 13.0782238,24.0614614 12.6862669,24.4672625 L6.7689153,30.3950218 C6.57058038,30.592964 6.30125728,30.7031282 6.02113376,30.7009681 Z" id="Shape"> </path> <path d="M23.7940039,12.9279998 C23.2155925,12.9290799 22.7458726,12.4609309 22.7447925,11.8825196 C22.7443016,11.6036724 22.855055,11.3361167 23.0525062,11.1391564 L28.9719197,5.21345901 C29.3879321,4.81158535 30.0509794,4.82317125 30.4528531,5.23918364 C30.84481,5.64508291 30.84481,6.28849315 30.4528531,6.69429424 L24.5355015,12.6199916 C24.3390321,12.8171483 24.0722619,12.9279998 23.7940039,12.9279998 Z" id="Shape"> </path> </g> </g> </g> </svg>