@gray_color: #5f5f5f; @lighter_gray_color: #8e8e8e; @link_color: #3ca1e7; @blue_color: #0073b9; @dark_blue_color: #0068a9; @default_width: 984px; @title_color: #618cfc; div.mainbar { width: 100%; min-width: @default_width; height: 553px; background-image: url('/images/mainbar_bg.png?-26'); background-repeat: repeat-x; overflow: hidden; } div.mainbar_image { width: @default_width; height: 553px; margin: auto; background-image: url('/images/mainbar_image_bg.jpg?-26'); background-repeat: no-repeat; color: white; text-shadow: -1px -1px black; } div#introduction { float: right; width: 450px; text-align: center; margin-right: 10px; } div#introduction h1 { font-size: 2.6em; font-weight: lighter; margin-top: 120px; margin-bottom: 50px; } div#watch { margin-top: 20px; padding-right: 10px; } div#watch a, div#watch a:visited { color: white; margin: 0 10px; } div#watch img { vertical-align: bottom; margin-right: 10px; } div#devices { width: 480px; float: left; position: relative; top: 100px; left: -250px; } div#store_buttons { width: 100%; min-width: @default_width; margin: auto; text-align: center; padding: 30px 0 25px 0; background-image: url('/images/store_buttons_bg.png?-26'); background-repeat: repeat-x; } div#store_buttons img { margin: 0 10px 0 10px; } p.learn_more { font-size: 0.8em; color: #999; } p.learn_more a { color: @link_color; } /* MiiPC Banner */ div#miipc_banner { width: 100%; border-bottom: 1px solid #cacaca; text-align: center; overflow: hidden; background: #ffffff; background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgd2lkdGg9IjEwMCUiIGhlaWdodD0iMTAwJSIgdmlld0JveD0iMCAwIDEgMSIgcHJlc2VydmVBc3BlY3RSYXRpbz0ibm9uZSI+CiAgPGxpbmVhckdyYWRpZW50IGlkPSJncmFkLXVjZ2ctZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPgogICAgPHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2ZmZmZmZiIgc3RvcC1vcGFjaXR5PSIxIi8+CiAgICA8c3RvcCBvZmZzZXQ9IjEwMCUiIHN0b3AtY29sb3I9IiNlNWU1ZTUiIHN0b3Atb3BhY2l0eT0iMSIvPgogIDwvbGluZWFyR3JhZGllbnQ+CiAgPHJlY3QgeD0iMCIgeT0iMCIgd2lkdGg9IjEiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+); background: -moz-linear-gradient(top, #ffffff 0%, #e5e5e5 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ffffff), color-stop(100%,#e5e5e5)); background: -webkit-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); background: -o-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); background: -ms-linear-gradient(top, #ffffff 0%,#e5e5e5 100%); background: linear-gradient(to bottom, #ffffff 0%,#e5e5e5 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#e5e5e5',GradientType=0 ); } div#miipc_banner h2 { display: inline-block; font-size: 20px; } div#miipc_banner img { margin: 0px 20px 13px 20px; vertical-align: middle; } div#miipc_banner a.close_button { display: block; width: 20px; height: 20px; background-image: url('/images/miipcbanner_close.png'); background-repeat: no-repeat; float: right; cursor: pointer; } /* Narrow Banner */ .top_narrow_banner { width: 100%; background-color: #fff6ec; text-align: center; padding: 10px 0; border-bottom: 1px solid #ffca91; } .top_narrow_banner_padding { padding: 0 36px; } .top_narrow_banner_padding h2 { font-size: 36px; font-weight: normal; color: #ff582a; } .top_narrow_banner_padding p { font-weight: normal; font-size: 18px; text-align: left; } .top_narrow_banner img { vertical-align: middle; margin: 0 2px 0 8px; width: 228px; height: 33px; } .top_narrow_banner a { color: @link_color; } .top_narrow_banner a:hover { text-decoration: none; color: @blue_color; } .coming_soon_box { background-color: #00d3ec; display: inline-block; color: white; padding: 5px 15px; } .closing-title { font-weight: normal; font-size: 36px; color: #ff582a; margin: 16px 0; } @media all and (-webkit-min-device-pixel-ratio: 1.5) { div.mainbar { background-image: url('/images/mainbar_bg@2x.png?-26'); background-size: 50px 567px; } div.mainbar_image { background-image: url('/images/mainbar_image_bg@2x.jpg?-26'); background-size: 984px 567px; } div#store_buttons { background-image: url('/images/store_buttons_bg@2x.png?-26'); background-size: 50px 13px; } }