body { font-family: TitilliumText25L1wt,Georgia,Arial,Helvetica,Tahoma,sans-serif,LucidaGrande,"Lucida Sans",Geneva; font-size:12px; background: #F2F2F2; color: #002950; line-height: 1.4; font-size: 13px; }

    #wrapper { margin:0 auto; width: 100%; padding: 75px 0 0 0; }

    .header { border-top: 5px solid #3693cf; background-color: #212121; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#333333), color-stop(85%, #262626), to(#0d0d0d)); background-image: -webkit-linear-gradient(#333333, #262626 85%, #0d0d0d); background-image: -moz-linear-gradient(top, #333333, #262626 85%, #0d0d0d); background-image: -o-linear-gradient(#333333, #262626 85%, #0d0d0d); background-image: linear-gradient(#333333, #262626 85%, #0d0d0d); background-repeat: no-repeat; height: 70px; line-height: 70px; vertical-align: middle; width: 100%; left: top; left: 0; top: 0; position: absolute; }
    .header .logo { max-width: 120px; padding-left: 20px; }
    .header .logo:hover { opacity: 0.7; }
    .header img { vertical-align: middle; }
    .header .logo { font-family: TitilliumText25L400wt; font-size: 28px; color: #191919; font-weight: normal; color: #bbbbbb; }
    .header .logo:hover { text-decoration: none; }
    .header .logo .title { padding: 0 0 0 10px; }
    .header .logo .title span { color: #BF364F; }
    /*
    .standardFont5 { display: block; overflow: hidden; font-family: TitilliumText25L1wt; font-size: 32px; color: #191919; font-weight: normal; }
    .standardFont5 strong { color: #BF364F; font-weight: normal; }
    .standardFont5 span { color: #BF364F; }
    .standardFont5.smallest { font-size: 14px; }
    .standardFont5.small { font-size: 18px; }
    .standardFont5.normal { font-size: 24px; }
    */
    .topResults { margin: 0 auto; display: block; overflow: hidden; padding: 50px 0 0 0; text-transform: uppercase; }
    .topResults .score { float: left; width: 50%; text-align: left; font-size: 18px; }
    .topResults .score strong, .topResults .score span { color: #BF364F; font-weight: normal; }
    .topResults .length { float: right; width: 50%; text-align: right; font-size: 18px; }
    .topResults .length strong, .topResults .length span { color: #BF364F; font-weight: normal; }
    .bottomResults { margin: 0 auto; display: block; overflow: hidden; text-transform: uppercase; }
    .bottomResults .speed { float: right; text-align: right; width: 100%; font-size: 18px; }
    .bottomResults .speed strong, .bottomResults .speed span { color: #BF364F; font-weight: normal; }

    .standardContainer { margin: 0; position: relative; padding: 45px 0 15px 0; text-align: center; }
    .standardContainer .blueStripe { width: 6px; height: 42px; position: absolute; z-index: 5; top: 15px; left: -6px; background: #01BBFF; }

    .whiteContainer { background: #FFF; position: relative; display: inline-block; vertical-align: top; overflow: hidden; border-left: 1px solid #E9E9E9; border-right: 1px solid #E9E9E9; border-bottom: 2px solid #D6DDDF; padding: 15px; margin: 0 auto; }
    .overflow { opacity: 0.5; }
    .whiteContainer .button.standardButton1 { position: absolute; top: 50%; left: 50%; margin: -22px 0 0 -91px; z-index: 10; }
    .whiteContainer .message { color: #ce596e; position: absolute; top: 35%; left: 50%; margin: -22px 0 0 -70px; z-index: 9; font-size: 32px; font-family: TitilliumText25L600wt; }
    .whiteContainer .alert { position: absolute; top: 0; left: 0; margin: 20px; z-index: 9; }
    .whiteContainer .counter { color: #1c242b; position: absolute; top: 50%; left: 50%; margin: -36px 0 0 -36px; z-index: 9; font-size: 32px; font-family: TitilliumText25L600wt; line-height: 32px; height: 32px; width: 32px; text-align: center; padding: 20px; border-radius: 36px; background: #fff; }
    .whiteContainer .yourResult { position: absolute; top: 48%; left: 50%; margin: -15px 0 0 -69px; z-index: 9; font-size: 22px; }
    .whiteContainer .yourResult span { color: #BF364F; font-family: TitilliumText25L400wt; }
    .whiteContainer .form-result { position: absolute; top: 65%; left: 0; margin: -22px 0 0 5px; }
    .transparentContainer { display: block; overflow: hidden; padding: 15px 0; }
    .lightBlueContainer { display: block; overflow: hidden; padding: 15px; background: #E4F1F6; }

    .controlBox { display: inline-block; position: relative; vertical-align: top; width: 220px; height: 482px; text-align: left; background: #FFF; margin: 0 10px 0 0; border-left: 1px solid #E9E9E9; border-right: 1px solid #E9E9E9; border-bottom: 2px solid #D6DDDF; }
    .controlBox .controlBoxHeader { background: #60b572; padding: 11px 20px; margin: 0 0 10px 0; position: relative; }
    .controlBox .controlBoxHeader h2 { color: #FFF; padding: 0; font-family: TitilliumText25L400wt; font-size: 16px; line-height: 16px; text-transform: uppercase; font-weight: normal; }
    .controlBox .controlBoxHeader .glyphicons-icon { position: absolute; top: -4px; right: -8px; }
    .controlBox .controlBoxContainer { padding: 0 10px; position: relative; }
    .controlBox .controlBoxContainer label { display: inline-block; position: relative; font-family: TitilliumText25L1wt; font-size: 14px; font-weight: normal; }
    .controlBox .controlBoxContainer input { color: #BF364F; display: inline-block; border: 0 none; padding: 0; margin: 0; width: 30px; }
    .controlBox .controlBoxContainer input.medium { width: 70px; }
    .controlBox .controlBoxContainer input.large { color: #BF364F; display: block; border: 1px solid #DEDEDC; padding: 0; margin: 5px 0 10px 0; width: 100%; }
    .controlBox .overlay { position: absolute; top: 0; left: 0; z-index: 10; opacity: 0.5; background: #fff; width: 100%; height: 100%; }
    .controlBox.second { margin: 0 0 0 10px; }
    .controlBox .buttons-container { text-align: center; margin: 5px 0 0 0; }
    .controlBox .buttons-container a.button { margin: 5px 0; width: 100px; }
    .controlBox .buttons-container button.button { margin: 5px 0; width: 140px; }

    .controlBox .sliderOverlay { margin-top: 0; }
    .controlBox .colorItem { padding-bottom: 10px; }
    .controlBox .colorPreview { width: 20px; height: 20px; float: left; border-radius: 4px; margin-bottom: -5px; margin-right: 10px; }
    .controlBox .colorPreviewLink { line-height: 20px; height: 20px; display: inline-block; margin-left: 10px; text-decoration: underline; color: #BF364F; font-family: TitilliumText25L1wt; font-size: 12px; font-weight: normal; }

    .results-list { margin: 0; }
    .results-list li { padding: 0; line-height: 48px; }
    .results-list li .glyphicons-icon {  }
    .results-list li .info { display: inline-block; font-size: 14px; line-height: 48px; }
    .results-list li .title { display: inline-block; width: 100px; }
    .results-list li .info .value { color: #BF364F; font-weight: normal; font-family: TitilliumText25L400wt; }

    .form-result input[type="text"] { margin: 0 10px 0 0; float: left; }
    .form-result .standardButton2 { margin: 0; }

    .directions { padding: 10px 0 0 0; margin: 10px 0 0 0; border-top: 1px dashed #1c242b; }
    .directions h3 { font-family: TitilliumText25L400wt; font-size: 16px; line-height: 16px; text-transform: uppercase; font-weight: normal; padding: 10px 0; }
    .directions p { padding: 5px 0 5px 10px; font-size: 16px; }
    .directions p strong { background: #1c242b; display: inline-block; padding: 3px; border-radius: 3px; color: #fff; width: 18px; height: 18px; text-align: center; line-height: 18px; font-family: TitilliumText25L400wt; font-size: 14px; font-weight: normal; }

    .map { display: block; overflow: hidden; margin: 0 auto; background: #60b572; }
    .map .column { display: block; overflow: hidden; clear: both; *width: 100%; }
    .map .row { float: left; height: 15px; width: 15px; cursor: pointer; }
    .editable .map .row:hover { background: #136324; }
    .map .snake { background: #257e38; border-radius: 8px; line-height: 14px; text-align: center; }
    .map .live { background: #257e38; line-height: 14px; text-align: center; }
    .map .snake.snakeHead { }
    .map .obstacle { background: #333333; }

    .map .fruit { background: url("/img/fruits.png"); }
    .map .fruit1 { background-position: 0 0; }
    .map .fruit2 { background-position: 0 -15px; }
    .map .fruit3 { background-position: 0 -30px; }
    .map .fruit4 { background-position: -15px 0; }
    .map .fruit5 { background-position: -30px 0; }

    .map .fruit.snake { background: #034e13; }

    .canvas { display: block; cursor: pointer; }

    /* footer */

    .footer { font-family: TitilliumText25L400wt; font-size: 14px; font-weight: normal; background-color: #212121; background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#333333), color-stop(85%, #262626), to(#0d0d0d)); background-image: -webkit-linear-gradient(#333333, #262626 85%, #0d0d0d); background-image: -moz-linear-gradient(top, #333333, #262626 85%, #0d0d0d); background-image: -o-linear-gradient(#333333, #262626 85%, #0d0d0d); background-image: linear-gradient(#333333, #262626 85%, #0d0d0d); color: #FFF; height: 30px; font-weight: normal; line-height: 30px; font-size: 11px; padding: 10px; z-index: 1; }

    /* sticky footer */

    html, body {height: 100%;}
    #wrap {min-height: 100%;}
    #wrapper{ overflow:auto; padding-bottom: 50px;}  /* must be same height as the footer */
    .footer {position: relative; margin-top: -50px; /* negative value of footer height */ height: 30px; clear:both;}

    /* switchers */

    .slider-frame { margin-right: 10px; margin-top: 8px; margin-bottom: 8px; }
    .slider-frame { position: relative; display: inline-block; width: 67px; background-color: #d5dde4; height: 23px; -moz-border-radius: 15px; border-radius: 15px; box-shadow: inset 0px 1px 5px 0px rgba(0, 0, 0, 0.3); }
    .slider-button { display: block; width: 37px; height: 21px; line-height: 23px; background: #fff; border: 1px solid #d0dde9; -moz-border-radius: 9px; border-radius: 9px; -webkit-transition: all 0.25s ease-in-out; -moz-transition: all 0.25s ease-in-out; transition: all 0.25s ease-in-out; color: #000; font-family: sans-serif; font-size: 11px; font-weight: bold; text-align: center; cursor: pointer; }
    .slider-button.on { margin-left: 29px; }

    /* fancy */

    .fancyContent { color: #FFF; display: block; overflow: auto; width: 550px; padding: 20px 20px 280px; }
    .fancyContent .standardHeader6 { color: #FFF; }
    .fancyContent .standardParagraph .lead { color: #FFF; }
    .fancyContent .standardParagraph p { color: #FFF; }
    .fancyContent .standardParagraph { color: #FFF; }
    .fancyContent .standardParagraph ul li { color: #FFF; }
    .fancyContent .standardParagraph ol li { color: #FFF; }

    /* info-message */

    .info-message { display: block; overflow: hidden; font-size: 14px; font-weight: bold; color: #008000; line-height: 1.2; padding: 5px 12px; clear: both; }
    .form .info-message { color: #FFF; padding: 0; }

    .info-message.correct { color: #008000; }
    .info-message.incorrect { color: #FF0000; }

    .info-correct { display: block; background: #78ce2b; color: #fff; padding: 10px; margin: 10px; border: solid 1px #429f0a; clear: both; }
    .info-error { display: block; background: #ed3729; color: #fff; padding: 10px; margin: 10px; border: solid 1px #e92020; clear: both; }

    .alert { font-family: Arial, sans-serif; font-size: 12px; line-height: 18px; margin-bottom: 15px; position: relative; padding: 14px 40px 14px 18px; -webkit-box-shadow: 0px 1px 1px 0px rgba(180, 180, 180, 0.1); box-shadow: 0px 1px 1px 0px rgba(180, 180, 180, 0.1); -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
    .alert { background-color: #FFFEE1 !important; color: #DAAC50 !important; border: 1px solid #F5C056 !important; }
    .alert.alert-error { background-color: #FDEAEA !important; color: #CA6F74 !important; border: 1px solid #F27B81 !important; }
    .alert.alert-success { background-color: #EDF6E5 !important; color: #7A9659 !important; border: 1px solid #9FC76F !important; }
    .alert.alert-info { background-color: #E9F8FF !important; color: #5D9FA9 !important; border: 1px solid #75C7D3 !important; }

    /* tables */
    .table-container { max-width: 960px; margin: 0 auto; }
    .table { width: 100%; margin-bottom: 20px; }
    .table-bordered { border: 1px solid #DDD; border-collapse: separate; border-left: 0; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
    .table th  { font-family: TitilliumText25L400wt; }
    .table td  { font-family: TitilliumText25L1wt; }
    .table th, .table td { padding: 8px; line-height: 20px; text-align: left; vertical-align: top; border-top: 1px solid #DDD; }
    .table-bordered th, .table-bordered td { border-left: 1px solid #DDD; }
    .table thead th { vertical-align: bottom; }
    .table-bordered thead:first-child tr:first-child > th:first-child, .table-bordered tbody:first-child tr:first-child > td:first-child { -webkit-border-top-left-radius: 4px; border-top-left-radius: 4px; -moz-border-radius-topleft: 4px; }
    .table-bordered thead:first-child tr:first-child > th:last-child, .table-bordered tbody:first-child tr:first-child > td:last-child { -webkit-border-top-right-radius: 4px; border-top-right-radius: 4px; -moz-border-radius-topright: 4px; }
    .table-bordered thead:last-child tr:last-child > th:first-child, .table-bordered tbody:last-child tr:last-child > td:first-child, .table-bordered tfoot:last-child tr:last-child > td:first-child { -webkit-border-bottom-left-radius: 4px; border-bottom-left-radius: 4px; -moz-border-radius-bottomleft: 4px; }
    .table-bordered thead:last-child tr:last-child > th:last-child, .table-bordered tbody:last-child tr:last-child > td:last-child, .table-bordered tfoot:last-child tr:last-child > td:last-child { -webkit-border-bottom-right-radius: 4px; border-bottom-right-radius: 4px; -moz-border-radius-bottomright: 4px; }
    .table-bordered th, .table-bordered td { border-left: 1px solid #DDD; }
    .table-striped tbody > tr:nth-child(odd) > td, .table-striped tbody > tr:nth-child(odd) > th { background-color: #F9F9F9; }

    /* forms */

    .form-horizontal .control-group { margin-bottom: 20px; }
    .form-horizontal .control-label { float: left; width: 140px; padding-top: 5px; text-align: right; }
    label, input, button, select, textarea { font-size: 14px; font-weight: normal; line-height: 20px; }
    .form-horizontal .controls { margin-left: 160px; }
    textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { background-color: #FFF; border: 1px solid #CCC; -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075); -webkit-transition: border linear 0.2s, box-shadow linear 0.2s; -moz-transition: border linear 0.2s, box-shadow linear 0.2s; -o-transition: border linear 0.2s, box-shadow linear 0.2s; transition: border linear 0.2s, box-shadow linear 0.2s; }
    select, textarea, input[type="text"], input[type="password"], input[type="datetime"], input[type="datetime-local"], input[type="date"], input[type="month"], input[type="time"], input[type="week"], input[type="number"], input[type="email"], input[type="url"], input[type="search"], input[type="tel"], input[type="color"], .uneditable-input { display: inline-block; height: 20px; padding: 4px 6px; margin-bottom: 10px; font-size: 14px; line-height: 20px; color: #555; vertical-align: middle; -webkit-border-radius: 4px; -moz-border-radius: 4px; border-radius: 4px; }
    label { padding-bottom: 2px; padding-bottom: 10px; }
    select { height: 30px; width: 100%; }
    select[disabled='disabled'] { opacity: 0.5; filter: alpha(opacity=50); }

    /* headings */

    h1, h2, h3, h4, h5, h6 { line-height: 1.3; }
    h1 { font-size: 24px; }
    h2 { font-size: 22px; }
    h3 { font-size: 20px; }
    h4 { font-size: 18px; }
    h5 { font-size: 16px; }
    h6 { font-size: 14px; }

    /* a hrefs */

    a { color: #107FC9; text-decoration:none; }
    a:active, a:focus, .active { outline:none; color: #107FC9; }
    a:hover { text-decoration: underline; color: #107FC9; }
    a span { cursor: pointer; }

    /* repair firefox bug */

    button::-moz-focus-inner{border:0; padding:0;}
    input::-moz-focus-inner{border:0; padding:0;}

    /* button */

    .button { display: block; border: none; cursor: pointer; }
    .button:hover { text-decoration: none; }

    .button.standardButton1 { font-family: TitilliumText25L1wt; display: inline-block; background: #BF364F; border-radius: 7px; font-size: 14px; color: #FFF; padding: 5px 20px; text-transform: uppercase; margin: 0; }
    .button.standardButton1.large { font-size: 18px; padding: 10px 40px; }
    .button.standardButton1:hover { background: #ce596e; }

    .button.standardButton2 { font-family: TitilliumText25L1wt; display: inline-block; background: #60b572; border-radius: 7px; font-size: 14px; color: #FFF; padding: 5px 20px; text-transform: uppercase; margin: 0; }
    .button.standardButton2:hover { background: #60b572; }

    /* iblock */

    .ib li, .iblock, .iblocka a, .iblocka span { display: -moz-inline-stack !important; display: inline-block !important; vertical-align: top !important; zoom: 1 !important; *display: inline !important; line-height: 1.4 !important; }
    .ib2 li { display: -moz-inline-stack !important; display: inline-block; vertical-align: top !important; zoom: 1 !important; *display: inline !important; line-height: 1.4 !important; }

    /* other */

    label { cursor: pointer; }

    .black { color: #000 !important; }
    .white { color: #FFF !important; }

    .paddingT5 { padding: 5px 0 0 0 !important; }
    .paddingT55 { padding: 55px 0 0 0 !important; }
    .paddingT20 { padding: 20px 0 0 0 !important; }
    .paddingT10 { padding: 10px 0 0 0 !important; }

    .marginT55 { margin: 55px 0 0 0 !important; }
    .marginT50 { margin: 50px 0 0 0 !important; }
    .marginT40 { margin: 40px 0 0 0 !important; }
    .marginT35 { margin: 35px 0 0 0 !important; }
    .marginT30 { margin: 30px 0 0 0 !important; }
    .marginT20 { margin: 20px 0 0 0 !important; }
    .marginT10 { margin: 10px 0 0 0 !important; }
    .marginT8 { margin: 8px 0 0 0 !important; }
    .marginT5 { margin: 5px 0 0 0 !important; }
    .marginB10 {margin: 0 0 10px 0 !important; }

    .fl { float: left !important; }
    .fr { float: right !important; }
    .clear { display: block; clear: both !important; }
    .clear:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
    .break { clear: both !important; min-height: 1px; }
    .uppercase { text-transform: uppercase !important;; }
    .noUppercase { text-transform: none !important;; }
    .noMargin { margin: 0px !important; }
    .noPadding { padding: 0px !important; }
    .noBorder { border: 0 none !important; }
    .noBackground { background: none !important; }
    .bold { font-weight: bold !important; }
    .italic { font-style: italic !important; }
    .normalWeight { font-weight: normal !important; }
    .static { position: static !important; }
    .block { display: block; }
    .alignLeft { text-align: left !important; }
    .alignRight { text-align: right !important; }
    .clearPattern { clear: both !important; background: url('/img/headings_border.png') repeat-x left bottom; display: block; overflow: hidden; height: 3px; margin: 15px 0; }
    .clearPattern.noMargin { margin: 0 !important; }
    .hide { display: none !important; }
    .simpleHide { display: none; }