.clear {
  clear: both;
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}


.clearfix:before,
.clearfix:after {
  content: '\0020';
  display: block;
  overflow: hidden;
  visibility: hidden;
  width: 0;
  height: 0;
}

.clearfix:after {
  clear: both;
}

body
{
    font-size: 14px;
    font-family: Arial, Helvetica, Sans-Serif;
    color: #4e4c4c;
    background-color: #f5f3f3;
    margin:0;
}

header,
footer,
nav,
section {
    display: block;
}

img {
    border:none;
}

a, a:hover 
{
    text-decoration:none;
    color: #4e4c4c; 
}

h1, h1 span
{
    margin: 0;
    line-height:24px;
    height:24px;
    width:100%;
    text-indent:20px;
    color: #d43c36;
    font-size:14px;
    text-transform:uppercase;
    background:#fff;
    border-bottom:1px solid #eb7679;
}

h1 span 
{
    text-indent:0;
}

h1.no-wrap
{
    white-space:nowrap;
    width: 100%;
    
}

h1.no-wrap span 
{
    display:inline-block;
    width: 90%;
    overflow:hidden;
    text-overflow:ellipsis;
    -o-text-overflow:ellipsis; 
}

h2 
{
    font-size: 18px;
    font-family:Georgia, Serif;
    font-style:italic;
    margin: 0 0 15px 0;
}

h2.red 
{
    color: #d21c43;
}

p
{
    font-size:14px;
    line-height:20px;
}

ul
{
    list-style:none;
    margin:0;
    padding:0;
}

ul li
{
    display:table;
/*    border-bottom: 1px solid #eb7679;*/
    border-bottom: 1px solid #bbb9b9;

    height: 50px;
    width:100%;
    line-height:25px;
    font-size: 14px;
    background-color: #eee; 
    background-image: url(../images/link-arrow.png), url(../images/li-background.png);
    background-repeat: no-repeat, repeat-x;
    background-position: right center, left top;
    
}

ul li span 
{
    display:table-cell;
    vertical-align:middle;
    
}

li.top 
{
    border-top:1px solid #eb7679;
}

li a 
{
    display:block;
    xwidth:100%;
    xheight: 100%;
    xbackground:#ccc;
    font-weight:bold;
    padding: 0 55px 0 20px;
}

ul.main, ul.top
{
    border-top: 1px solid #eb7679;
}

ul.main li
{
    text-transform:uppercase;
    text-align:center;
    font-weight:bold;
    text-indent:0;
    font-size:18px;
    background-image: url(../images/li-background.png);
    background-repeat: repeat-x;
    background-position: left top;
}

ul.main li a, ul.main li:hover, ul.main li:visited 
{
    color: #000000;
    text-decoration:none;
    padding:0;
}

ul.menu li 
{
    text-transform:uppercase;
}

div.content 
{
    padding: 20px;
}

div.thumbnail 
{
    width:139px;
    height: 110px;
    overflow:hidden;
    margin: -5px 0 15px -5px;
}

dl
{
    width:100%;
}

dt
{
    line-height:22px;
    font-weight:bold;
    display:block;
    width:70%;
    float:left;
    margin:0;
    padding:0;
}

dd
{
    text-align:right;
    display:block;
    float:right;
    width:25%;
    color: #d21c43;
    font-weight:bold;
    margin:0;
    padding:0;
}


/* HEADER */
#header 
{
    width:100%;
    height:91px;
/*    background:url(../images/header-background.jpg) repeat-x;*/
    border-top:1px solid #000;
   
}

a.logo 
{
    display:block;
    width:147px;
    height:78px;
    background:url(../images/logo.png) no-repeat;
    margin: 5px auto 0 auto;
}

a.back 
{
    float:left;
    display:block;
    padding:0;
    margin: 8px 0 0 10px;
    display:block;
    height:20px;
    width:56px;
    background:url(../images/back-button.png) no-repeat;  
}

/* PROMO SETUP */
#header.promo 
{
    background:url(../images/cheesy-header-background.jpg) repeat-x;
}

#header.promo a.logo
{
    width:139px;
    height:81px;
    background:url(../images/cheesy-logo.png) no-repeat;
    margin: 5px auto 0 auto;
}

p.error 
{
    font-size:18px;
    text-align:center;
}

h2.error, h3.error, h4.error
{
    color: #d43c36;
    text-transform:uppercase;
    text-align:center;
    font-family: Arial, Helvetica, Sans-Serif;
    margin: 0px;
    padding:0px;
    font-style:normal;
}

h2.error 
{
    font-size:36px;
}

h3.error
{
    font-size:24px;
}

h4.error
{
    font-size:28px;
}


#menuCalculator 
{
    width:100%;
    position:relative;
    overflow:hidden;
}

#menuCalculator a 
{
    text-decoration:none;
}

#menuCalculator .panels 
{
    width: 1000px;
    position:relative;
}

#menuCalculator .panels p
{
    margin: 10px 20px 0 20px;
    font-family: Georgia, Times New Roman;
    font-size:14px;
    font-style:italic;
}


#menuCalculator a.view-calc
{
   display:block;
   width:200px;
   height:41px;
   background:url(../images/calc-view-button.png) no-repeat;
   margin: 20px auto 15px auto;
}


#menuCalculator ul li a 
{
    text-transform:uppercase;
}
#menuCalculator .menus
{
    width:300px;
    float:left;
}
#menuCalculator .menus ul 
{
    width:100%;
}

#menuCalculator .menus ul li a.selected 
{
    color: #d21e44;
}

#menuCalculator .items 
{
    width:300px;
    float:left;
}

#menuCalculator .items.child-items 
{
    display:none;
}

#menuCalculator .items div.inner div.parent
{
    margin: 0 0 0 15px;
}

#menuCalculator .items.child-items ul li.child
{
    background-image: url(../images/li-background.png);
    background-repeat: repeat-x;
    background-position: left top;
}

#menuCalculator .items.child-items ul li div 
{
    display:table-cell;
    vertical-align:middle;
}

#menuCalculator .items.child-items ul li span.check
{
    display:inline-block;
    width: 25px;
    height:25px;
    background:url(../images/calc-check-mark.png) no-repeat left -25px;
    margin: 0 0 0 5px;
}

#menuCalculator .items.child-items ul li.selected span.check 
{
    background-position:left top;
}

#menuCalculator .items.child-items ul li span.name 
{
    display:inline-block;
    
}

#menuCalculator .items.child-items ul 


#menuCalculator .items ul 
{
    width:100%;
}

#menuCalculator .items .menu ul li {
    background-image: url("../images/add-arrow.png");
}



#menuCalculator div.totals 
{
    width:300px;
    float:left;
}

#menuCalculator .totals ul.selected-items
{
    width:280px;
    margin: 0 auto 0 auto;
    display:none;
}

#menuCalculator .totals ul.selected-items li
{
    background:none;
    border:none;
    display:block;
    clear: both;
    border-bottom:1px solid #d9d9d9;
    height:100%;
    
}

#menuCalculator div.totals ul.selected-items div.thumbnail 
{
    display:block;
    float:left;
}

#menuCalculator div.totals ul.selected-items div.thumbnail img 
{
    display:block;
}
#menuCalculator div.totals ul.selected-items a.delete 
{
    display:block;
    float:left;
    width:108px;
    height:36px;
    margin: 35px 0 0 20px;
    padding:0;
    background:url(../images/calc-delete-button.png) no-repeat;
    
}

#menuCalculator .totals ul.selected-items ul.children li 
{
    border:none;
}

#menuCalculator div.totals a.add-more 
{
   display:block;
   width:200px;
   height:41px;
   background:url(../images/calc-add-more-button.png) no-repeat;
   margin: 20px auto 20px auto;
}
#menuCalculator div.totals div.summary
{
    display:block;
    width:298px;
    height: 427px;
    background:url(../images/calc-total-background.png) no-repeat;
    padding: 1px 0 0 0;
    margin: 0 auto 0 auto;
}


#menuCalculator div.totals div.summary h3 
{
    margin: 20px 0 0 20px;
}


#menuCalculator div.totals ul.totals
{
    margin: 20px 20px 20px 20px;
}

#menuCalculator div.totals ul.totals li 
{
    background:none;
    border:none;
    height:100%;
    font-family: Georgia, Times New Roman;
    font-size:14px;
    font-style:italic;
    line-height:20px;
    margin: 0 0 10px 0;
}

#menuCalculator div.totals h3
{
     font-family: Georgia, Times New Roman;
     font-style:italic;
}

#menuCalculator div.totals ul.totals li span 
{
   
    display:inline-block;
    float:right;
    font-weight:bold;
    font-family: Arial, Helvetica, Sans-Serif;
    font-size:20px;
    font-style:normal;
}

#menuCalculator a.view-items
{
   display:block;
   width:200px;
   height:41px;
   background:url(../images/calc-view-items-button.png) no-repeat left top;
   margin: 20px auto 15px auto;
}

#menuCalculator a.view-items.selected 
{
   background:url(../images/calc-view-items-button.png) no-repeat left -41px;
    
}

/* APPS */
body.apps 
{
    background:url('../images/apps-background.jpg') repeat-x;
  
    background-color:#cecece;
}

body.apps #header 
{
    background-image:none;
}

body.apps h1 
{
    background:none;
    border:none;
    display:none;
}

body.apps h2 
{
    font-family: Arial, Helvetica, Sans-Serif;
    font-style:normal;
    font-weight:bold;
    color: #4e4c4c;
    xfont-size:30px;
    margin: 15px 22px 0 22px;
}

body.apps p 
{
    xfont-size:20px;
    color: #4e4c4c;
    margin: 15px 22px 0 22px;
}

body.apps p span.strong 
{
    font-weight:bold;
    text-transform:uppercase;
}

body.apps p.soon 
{
    font-family:Georgia, Serif;
    font-size:18px;
    font-style:italic;
    font-weight:bold;
    text-align:center;
    margin-top:30px;
}


body.hobbit 
{
    background-color:#000;
    text-align:center;
    min-height:320px;
}

body.hobbit div#header 
{
    background:none;
}

body.hobbit a.logo
{
    width:121px;
    height:68px;
    background:url(../images/logo.png) no-repeat;
    margin: 20px auto 0 auto;
}

body.hobbit div.content {
    padding:0;
}


body.hobbit h2 
{
    font-size:22px;
    color:#eea21e;
    text-align:center;
    margin: 0 0 0 0;
    font-style:normal;
    font-weight:bold;
    font-family: Arial, Helvetica, Sans-Serif;
}

body.hobbit a.play 
{
    font-size:34px;
    font-weight:bold;
    color:#fe2025;
    text-align:center;
    margin: 4px 20px 0 20px;
    display:block;
}

body.hobbit a.play.watch 
{
    font-size:40px;
}

body.hobbit a.play.watch.small 
{
    font-size:34px;
}

body.hobbit a.play span 
{
    color:#eea21e;
}



body.hobbit p 
{
    color: #eea21e;
    font-size:27px;
    line-height:30px;
    font-weight:bold;  
    padding: 0 70px 0 70px;  
}

body.hobbit video 
{
    display:none;
}


body.hobbit div.hobbit-splash
{
    width: 439px;
    height: 139px;
    background:url(../images/hobbit-splash.png) no-repeat;
    margin: 18px auto 0 auto;
}

@media and (min-device-pixel-density: 2), and (min--min-device-pixel-density: 2), and (-webkit-min-device-pixel-ratio: 2) 
{
    
    body.hobbit a.logo
    {
        background:url(../images/logo.png) no-repeat;
        background-size:cover;
    }

    body.hobbit div.hobbit-splash
    {
        background:url(../images/hobbit-splash@2x.png) no-repeat;
        background-size:cover;
    }  
}

@media screen and (orientation:portrait)
{
    body.hobbit div#header 
    {
        margin-top:15px;
    }
    
    body.hobbit div.hobbit-splash 
    {
        width:309px;
        height: 98px;
        margin-top: 24px;
        background-size:100% 100%;
    }
    
    body.hobbit a.play 
    {
        margin-top:25px;
    }
}

/* ~~ The footer ~~ */
.footer {
	padding: 5px 0;
/*	background-color: #CCC49F;*/
	font-size:10px
}