h3,li,p{font-size:1.4rem;line-height:2rem}html{font-size:62.5%;height:100%;-webkit-text-size-adjust:100%;-ms-text-size-adjust:100%;overflow:-moz-scrollbars-vertical;overflow-x:hidden;overflow-y:scroll}body{padding:0;position:relative;text-rendering:optimizelegibility;font-size:1em;line-height:1;font-family:Helvetica,Arial,sans-serif}table{border-collapse:collapse;border-spacing:0}body,figure,h1,h2,h3,h4,img,ol,p,table,td,ul{margin:0}ol,ul{padding-left:0}a:link,a:visited{text-decoration:none}a:hover{text-decoration:underline}pre{overflow:auto}code{white-space:pre-wrap}pre>code{white-space:pre}button{cursor:pointer}button:disabled{cursor:default}.bellmaker_container{margin-right:auto;margin-left:auto}.bellmaker_container:after{content:"";float:none;clear:both;display:block}[role=banner],[role=main]{margin:0 auto;overflow:auto;box-sizing:border-box}[role=banner]>h1{padding:2rem 2rem 0}h1{font-weight:400}p,ul{padding:0 2rem 2rem}ul ul{padding-bottom:0;padding-left:2rem}h2{font-size:2rem;line-height:3rem;padding:0 2rem}[role=banner] h2{padding:0 2rem 2rem;font-weight:400}h3{padding:0 2rem}#basic_query:before{content:"Device-agnostic: ";font-weight:700}#basic_query:after{display:block}@media only screen and (min-width:320px){.bellmaker_container{width:100%}h1{font-size:6rem;line-height:6rem}[role=banner],[role=main]{background-color:rgba(0,0,255,.1)}#basic_query:after{content:"baseline - 100% liquid for screens at 320 to 480"}}@media only screen and (min-width:480px){.bellmaker_container{width:100%}h1{font-size:3rem;line-height:4rem}[role=banner],[role=main]{background-color:rgba(0,255,255,.1)}#basic_query:after{content:"2x-small - 100% liquid for screens at 480 to 640"}}@media only screen and (min-width:640px){.bellmaker_container{width:100%}[role=banner],[role=main]{background-color:rgba(255,0,255,.1)}#basic_query:after{content:"x small - 100% liquid for screens at 480 to 768"}}@media only screen and (min-width:768px){.bellmaker_container{width:76.8rem}[role=banner],[role=main]{background-color:rgba(0,0,255,.2)}#basic_query:after{content:"small - 768 pixels for screens at 768 to 1024"}}@media only screen and (min-width:1024px){.bellmaker_container{width:96rem}[role=banner],[role=main]{background-color:rgba(0,255,255,.2)}#basic_query:after{content:"medium - 960 pixels for screens at 1024 to 1280"}}@media only screen and (min-width:1280px){.bellmaker_container{width:115.2rem}[role=banner],[role=main]{background-color:rgba(255,0,255,.2)}#basic_query:after{content:"large - 1152 pixels for screens at 1280 to 1440"}}@media only screen and (min-width:1440px){.bellmaker_container{width:134.4rem}[role=banner],[role=main]{background-color:rgba(255,255,0,.2)}#basic_query:after{content:"x-large - 1296 pixels for screens at 1440 and up"}}#device_sniffer:before{content:"Device-specific: ";font-weight:700}#device_sniffer:after{content:"none detected";display:block}@media only screen and (min-device-width :768px)and (max-device-width :1024px)and (-webkit-min-device-pixel-ratio:1)and (device-aspect-ratio:4/3)and (orientation :landscape){#device_sniffer:after{content:"early iPad in landscape mode"}}@media only screen and (min-device-width :768px)and (max-device-width :1024px)and (-webkit-min-device-pixel-ratio:1)and (device-aspect-ratio:3/4)and (orientation :portrait){#device_sniffer:after{content:"early iPad in portrait mode"}}@media only screen and (min-device-width :768px)and (max-device-width :1024px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:4/3)and (orientation :landscape){#device_sniffer:after{content:"retina iPad in landscape mode"}}@media only screen and (min-device-width :768px)and (max-device-width :1024px)and (-webkit-min-device-pixel-ratio:1)and (device-aspect-ratio:3/4)and (orientation :portrait){#device_sniffer:after{content:"retina iPad in portrait mode"}}@media only screen and (min-device-width :320px)and (max-device-width :480px)and (-webkit-min-device-pixel-ratio:1)and (device-aspect-ratio:3/2)and (orientation :landscape){#device_sniffer:after{content:"early iPhone in landscape mode"}}@media only screen and (min-device-width :320px)and (max-device-width :480px)and (-webkit-min-device-pixel-ratio:1)and (device-aspect-ratio:2/3)and (orientation :portrait){#device_sniffer:after{content:"early iPhone in portrait mode"}}@media only screen and (min-device-width :320px)and (max-device-width :480px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:3/2)and (orientation :landscape){#device_sniffer:after{content:"iPhone 4(s) in landscape mode"}}@media only screen and (min-device-width :320px)and (max-device-width :480px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:2/3)and (orientation :portrait){#device_sniffer:after{content:"iPhone 4(s) in portrait mode"}}@media only screen and (min-device-width :320px)and (max-device-width :568px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:71/40)and (orientation :landscape){#device_sniffer:after{content:"iPhone 5(s)(c) in landscape mode"}}@media only screen and (min-device-width :320px)and (max-device-width :568px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:40/71)and (orientation :portrait){#device_sniffer:after{content:"iPhone 5(s)(c) in portrait mode"}}@media only screen and (min-device-width :414px)and (max-device-width :736px)and (-webkit-min-device-pixel-ratio:3)and (orientation :landscape){#device_sniffer:after{content:"iPhone 6 Plus in landscape mode"}}@media only screen and (min-device-width :414px)and (max-device-width :736px)and (-webkit-min-device-pixel-ratio:3)and (orientation :portrait){#device_sniffer:after{content:"iPhone 6 Plus in portrait mode"}}@media only screen and (min-device-width :360px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:2)and (orientation :landscape),only screen and (min-device-width :360px)and (max-device-width :640px)and (min-resolution:2dppx)and (orientation :landscape){#device_sniffer:after{content:"720p HD:2 in landscape mode"}}@media only screen and (min-device-width :360px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:2)and (orientation :portrait),only screen and (min-device-width :360px)and (max-device-width :640px)and (min-resolution:2dppx)and (orientation :portrait){#device_sniffer:after{content:"720p HD:2 in portrait mode"}}@media only screen and (min-device-width :375px)and (max-device-width :667px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:667/375)and (orientation :landscape){#device_sniffer:after{content:"iPhone 6 in landscape mode"}}@media only screen and (min-device-width :375px)and (max-device-width :667px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:375/667)and (orientation :portrait){#device_sniffer:after{content:"iPhone 6 in portrait mode"}}@media only screen and (min-device-width :384px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:5/3)and (orientation :landscape),only screen and (min-device-width :384px)and (max-device-width :640px)and (min-resolution:2dppx)and (device-aspect-ratio:5/3)and (orientation :landscape){#device_sniffer:after{content:"15:9 HD:2 in landscape mode"}}@media only screen and (min-device-width :384px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:3/5)and (orientation :portrait),only screen and (min-device-width :384px)and (max-device-width :640px)and (min-resolution:2dppx)and (device-aspect-ratio:3/5)and (orientation :portrait){#device_sniffer:after{content:"768 HD:2 in portrait mode"}}@media only screen and (min-device-width :320px)and (max-device-width :533px)and (-webkit-min-device-pixel-ratio:2.4)and (device-aspect-ratio:533/320)and (orientation :landscape),only screen and (min-device-width :320px)and (max-device-width :533px)and (min-resolution:2.4dppx)and (device-aspect-ratio:533/320)and (orientation :landscape){#device_sniffer:after{content:"768 HD:2.4 in landscape mode"}}@media only screen and (min-device-width :320px)and (max-device-width :533px)and (-webkit-min-device-pixel-ratio:2.4)and (device-aspect-ratio:320/533)and (orientation :portrait),only screen and (min-device-width :320px)and (max-device-width :533px)and (min-resolution:2.4dppx)and (device-aspect-ratio:320/533)and (orientation :portrait){#device_sniffer:after{content:"768 HD:2.4 in portrait mode"}}@media only screen and (min-device-width :400px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:8/5)and (orientation :landscape),only screen and (min-device-width :400px)and (max-device-width :640px)and (min-resolution:2dppx)and (device-aspect-ratio:8/5)and (orientation :landscape){#device_sniffer:after{content:"800 WXGA2 in landscape mode"}}@media only screen and (min-device-width :400px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:2)and (device-aspect-ratio:5/8)and (orientation :portrait),only screen and (min-device-width :400px)and (max-device-width :640px)and (min-resolution:2dppx)and (device-aspect-ratio:5/8)and (orientation :portrait){#device_sniffer:after{content:"800 WXGA2 in portrait mode"}}@media only screen and (min-device-width :360px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:3)and (orientation :landscape),only screen and (min-device-width :360px)and (max-device-width :640px)and (min-resolution:3dppx)and (orientation :landscape){#device_sniffer:after{content:"Full HD:3 in landscape mode"}}@media only screen and (min-device-width :360px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:3)and (orientation :portrait),only screen and (min-device-width :360px)and (max-device-width :640px)and (min-resolution:3dppx)and (orientation :portrait){#device_sniffer:after{content:"Full HD:3 in portrait mode"}}@media only screen and (min-device-width :360px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:4)and (orientation :landscape),only screen and (min-device-width :360px)and (max-device-width :640px)and (min-resolution:4dppx)and (orientation :landscape){#device_sniffer:after{content:"WQHD:4 in landscape mode: LG "}}@media only screen and (min-device-width :360px)and (max-device-width :640px)and (-webkit-min-device-pixel-ratio:4)and (orientation :portrait),only screen and (min-device-width :360px)and (max-device-width :640px)and (min-resolution:4dppx)and (orientation :portrait){#device_sniffer:after{content:"WQHD:4 in portrait mode"}}#aspect_ratio:before{content:"Aspect Ratio: ";font-weight:700}#aspect_ratio:after{content:"unable to detect";display:block}@media only screen and (device-aspect-ratio:4/3)and (orientation :landscape){#aspect_ratio:after{content:"3:4 screen in landscape mode"}}@media only screen and (device-aspect-ratio:3/4)and (orientation :portrait){#aspect_ratio:after{content:"3:4 screen in portrait mode"}}@media only screen and (device-aspect-ratio:3/2)and (orientation :landscape){#aspect_ratio:after{content:"5:8 screen in landscape mode"}}@media only screen and (device-aspect-ratio:2/3)and (orientation :portrait){#aspect_ratio:after{content:"5:8 screen in portrait mode"}}@media only screen and (device-aspect-ratio:5/3)and (orientation :landscape){#aspect_ratio:after{content:"3:5 screen in landscape mode"}}@media only screen and (device-aspect-ratio:3/5)and (orientation :portrait){#aspect_ratio:after{content:"3:5 screen in portrait mode"}}@media only screen and (device-aspect-ratio:3/2)and (orientation :landscape){#aspect_ratio:after{content:"2:3 screen in landscape mode"}}@media only screen and (device-aspect-ratio:2/3)and (orientation :portrait){#aspect_ratio:after{content:"2:3 screen in portrait mode"}}@media only screen and (device-aspect-ratio:16/9){#aspect_ratio:after{content:"9:16 screen in landscape mode"}}@media only screen and (device-aspect-ratio:9/16){#aspect_ratio:after{content:"9:16 screen in portrait mode"}}