html{
    background-color: #222;
}
html, body {
    height: 100%;
    width: 100%;
    margin: 0;
    padding: 0;
    background: url(party_images/1920.jpg)#000000;
  
}

h1{
    font-family: 'Limelight', cursive;
    color: #DBDBD7;
    font-weight: 400;
    font-size: 9em;
    text-align: center;
    margin:0 auto;
    border-bottom: 5px double #AD9423;
    display: table;
    width: 100%;
   

}
h1 a{
    color: #dbdbd7;
    text-decoration: none;
}

 ul{
    padding: 0;
    margin: 0;
}
 
#nav {
    text-align: center;
    margin: 0;
    padding: 0;
   

}
#nav li{
    display: inline;
}
#nav a{
    display: inline-block;
}
#nav ul li a {
font-family: 'Limelight', cursive;
text-decoration: none;
background-color: #000;
font-size: 1em;
color:#DBDBD7;
border:10px double #AD9423;
padding:1% 2%;

  }

#nav ul li a:hover
{
text-decoration: none;
list-style: none;
text-shadow: 0 0 10px #fff;

}
#container{
   border-right:5px double #AD9423;
   border-left:5px double #AD9423;
   padding:5px;
   width: 60%;
   margin: 0 auto;
   background-color: #000;
   text-align: center;

}

.group::after{
    content: "";
    display: table;  
    clear: both;
}
* html .group             { zoom: 1; } /* IE6 */
*:first-child+html .group { zoom: 1; } /* IE7 */

 


 .g img{
    margin:0;
    padding:0;
    list-style: none;
      max-width: 100%;
 }
 
.g li  {
  float: left;
  width:28%;
  height: 10%;
  margin: 2.4%;
  padding:0;
}
 
#ben {
    float: right;


    padding-right: 7%;
    padding-top: 3%;
     padding-bottom: 5%;
margin: 0;
}
.ben  {
    font-family: 'Federo', sans-serif;
    color:#DBDBD7; 
    text-align: left;
    float: left;
    font-size: 0.9em;
    width: 35%;
    padding-left: 7%;
    padding-right: 3%;
    padding-top: 3%;
    padding-bottom: 5%
}


.bubble p{
color: #fff;   
font-size: 0.8em;
width:52%;
padding: 0.5% 1.5%;
margin: 1% 5% 0 5%;
font-family: 'Federo', sans-serif;
font-weight: 400;

}
.bubble p:first-child{
    margin-top: 1%;
}
.bubble p:last-child{
    margin-bottom: 1%;
}
.bubble p:nth-of-type(even){
    background-color: #290F0F;
    border:1px solid #4D2C2C;
    float: right;
}
.bubble p:nth-of-type(odd){
    background-color: #1C1C1C;
    border: 1px solid #4A4848;
    float: left;
}
#deets p{
color: #DBDBD7;   
font-size: 0.8em;
font-family: 'Federo', sans-serif;
text-align: center;
line-height: 1.5;
margin-top: 5px;
margin-bottom: 5px;

}

#questions {
  
    margin-left: 15%;
    width: 80%;
    margin:0 auto;
    padding: 0;
}
.qna{
    margin: 0;
    padding: 0;
}
.qna p{
color: #DBDBD7;   
font-size: 0.9em;
font-family: 'Federo', sans-serif;
text-align: center;
}
h3{
  font-family: 'Federo', sans-serif;
  color: #DBDBD7;
  font-size: 1em;  
  padding: 0;
  margin: 0;
  text-align: center;
}
.star{
    font-size: 1.5em;
    color: #AD9423;
    text-align: center;
}
.wrapper {
    width:95%;
    margin:0 auto;
    position:relative;
    padding-bottom: 3%;
}
#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form input[type="tel"],
#contact-form input[type="url"],
#contact-form textarea,
#contact-form button[type="submit"] {
    font:400 12px/12px "Helvetica Neue", Helvetica, Arial, sans-serif;
}
#contact-form {
    border:1px solid #4A4848;
    background:#1C1C1C;
    padding:25px;
    width: 50%;
    margin:0 auto;
}

#contact-form label span {
    cursor:pointer;
    color:#DBDBD7;
    display:block;
    margin:5px;
    font-family: 'Federo', sans-serif;
}
#contact-form input[type="text"],
#contact-form input[type="email"],
#contact-form input[type="tel"],
#contact-form input[type="url"],
#contact-form textarea {
    width:90%;
    box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -webkit-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    -moz-box-shadow:inset 0 1px 2px #DDD, 0 1px 0 #FFF;
    border:1px solid #CCC;
    background:#FFF;
    margin:0 0 5px;
    padding:10px;
    border-radius:5px;
}
#contact-form input[type="text"]:hover,
#contact-form input[type="email"]:hover,
#contact-form input[type="tel"]:hover,
#contact-form input[type="url"]:hover,
#contact-form textarea:hover {
    -webkit-transition:border-color 0.3s ease-in-out;
    -moz-transition:border-color 0.3s ease-in-out;
    transition:border-color 0.3s ease-in-out;
    border:1px solid #AAA;
}
#contact-form textarea {
    height:100px;
    max-width:100%;
}
#contact-form button[type="submit"] {
    cursor:pointer;
    width:90%;
    font-family: 'Federo', sans-serif;
    background-color: #290F0F;
    border:1px solid #4D2C2C;
    color:#FFF;
    margin:0 0 5px;
    padding:10px;
    border-radius:5px;
}
#contact-form button[type="submit"]:hover {
    background-color: #AB6161;
    color: #1C1C1C;
    -webkit-transition:background 0.3s ease-in-out;
    -moz-transition:background 0.3s ease-in-out;
    transition:background-color 0.3s ease-in-out;
}
#contact-form button[type="submit"]:active {
    box-shadow:inset 0 1px 3px rgba(0,0,0,0.5);
}
#contact-form input:focus,
#contact-form textarea:focus {
    outline:0;
    border:1px solid #999;
}
::-webkit-input-placeholder {
    color:#888;
}
:-moz-placeholder {
    color:#888;
}
::-moz-placeholder {
    color:#888;
}
:-ms-input-placeholder {
    color:#888;
}
#details p{
    color: #DBDBD7;
    font-family: 'Federo', sans-serif;
    font-size: 0.8em;
    margin: 0 auto;
    padding-bottom: 1%;
}





table{
    border: 1px solid #4A4848;
    font-family: 'Federo', sans-serif;
    background-color: #1C1C1C;
    color: #fff;
    font-size: 0.8em;
    width: 80%;
    margin: 0 auto;
    border-collapse: collapse;
}
   th{
    border:1px solid #4D2C2C;
    background-color: #290F0F;
    padding: 1%;
  }
table td{
    border: 1px solid #4A4848;
    width: 33.33333333%;
    padding-top: 0.8%;
}
.title{
    text-decoration: underline;
}






footer{
    font-family: 'Federo', sans-serif;
    width:100%;
    border-top:5px double #AD9423;
    font-size: 0.7em;
    color: #fff;
    line-height: 0.7em;
    bottom: 0;
    clear: both;
    margin: 0 auto;
   
    }
    footer p{
        float: left;
          padding: .6% 2%;
    }
    footer a{
        float: right;
        padding: 0.6% 1%;

    }
@media all and (max-width: 1460px){
      #container{
            width: 70%;
        }
}
     @media all and (max-width: 1298px){
        h1{
            font-size: 8em;
        }
        #nav ul li a{
            font-size: 0.9em;
            border:5px double #AD9423;
            padding:1% 1%;
        }
      #container{
            width: 75%;
        }
        p{
            font-size: 0.8em;
        }
        .qna p{
            font-size: 0.8em;
        }
        #deets p{
          font-size: 0.7em;  
        }
        .ben {
            width: 38%;
            font-size: 0.8em;
            padding-left: 3%;
        }
        #ben {
            padding-top: 2%;
            width: 40%;

        }
        h3{
            font-size: 1em;
        }
        #questions{
            width: 70%;
        }
}
    @media all and (max-width: 1113px){
        .ben {
            width: 30%;
            font-size: 0.7em;
            padding-left: 2%;}  
             #nav ul li a{
            font-size: 0.8em;}
    }
        @media all and (max-width: 957px){
            #ben {
                width: 40%;
            }
          .ben {
            width: 40%;}
            h3{
                font-size: 0.9em;
            }
            .qna p{
            font-size: 0.7em;
        }
         #deets p{
          font-size: 0.6em;  }
           #nav ul li a{
            font-size: 0.8em;}
         #container {
              padding:3px;
              width: 90%;}
         
              .g li  {
              float: left;
             width:45%;
            margin: 2%;
  
 
}
    }



    @media all and (max-width: 882px){
        h1{
            font-size: 6em;}
        #nav ul li a{
            font-size: 0.75em;
            border:4px double #AD9423;
            padding:0.5% 0.5%;
            margin:-2px;}
        .qna p{
            font-size: 0.7em;}
               #deets p{
          font-size: 0.5em;  
        }
       
        table{
            font-size: 0.7em;
        }      
    
        }
@media all and (max-width: 768px){
    #nav-wrap{
        display: table;
        width: 100%;
    }
#nav {
    display: table-cell;
 vertical-align: middle;

    padding-bottom: 0.5%;

}
#nav {
    vertical-align: top;
  
}
#nav a {
    display: block;
  
}

}

    @media all and (max-width: 635px){
        h1{
            font-size: 3em;
        }
        #nav ul li a{
            font-size: 0.6em;
            border:3px double #AD9423;
            margin:-2px;
        }
        .bubble p{
            font-size: 0.6em;
            width: 90%;
            float: none;
        }
        .qna p{
            font-size: 0.5em;}
             #deets p{
          font-size: 0.4em;  
        }
            h3{
                font-size: 0.8em;
            }
        #container{
            padding:5px;
            width: 97%;
            border-right:0px;
            border-left:0px;
}
        
        
}
@media all and (max-width: 480px){
        #ben {
              display: none;
}
       .ben {
         width:95%;
         text-align: center;
         float: none;
         padding:2%;
         padding-left: 2%;
         margin: 1%;
         font-size: 0.4em;
}
         #galleria{
         height:200px;
}         
         .bubble p{
        font-size: 0.4em;
    }
    #nav ul li a{
            font-size: 0.5em;
        
          table{
            font-size: 0.5em;
        }  
        h3{
            font-size: 0.6em;
        } 
        #questions {
            width: 95%;
        }
}