* {
    margin: 0;
    padding:0;
}

html,body {
    background-color:#ffffff;
    font-family: 'Lato', sans-serif;
    font-size: 20px;
    font-weight: 300;
}

/* ----- HEADER ----- */
#logo {
    margin:8px;
    width:55px;
    float:left;
}

h1 {
    padding:10px 0px;
    color: #000;
    font-weight: 300;
    word-spacing: 3px;
    letter-spacing: 1px;
    font-size: 170%;
    float: left;
    
}

#top-bar {
    width: 100%;
    margin:0;
    height:70px;
    backface-visibility: .7;
    background-color:#ffffff;
    border-bottom: 3px #f31313 solid;
/*    overflow: hidden;*/
}

/* ----- NAVIGATION ----- */
nav {
    float: right;
    margin: 17px 5% 10px 10px ;
}

nav ul {
    display: block;
    list-style-type: none;
}

nav ul li {
    font-size: 105%;
    display: inline-block;
    float: left;
    padding: 0px 15px;
}

nav ul li a:hover {
    color:#000000;
    border-bottom: 2px #f31313 solid ;
    text-transform:none;
}
a , a:link, a:visited {
    text-decoration: none;
    color: black;
}

/* ----- mobile navigation -----*/

.topnav .icon {
            display: none;
        }

/* ----- SECTION TWO ----- */

#section-two {
    background-color:#ffffff;
    height:500px;
    width:100%;
    background-attachment: fixed;
   
    
}

h2 {margin: auto;
    
    margin-top: 30px;
    text-align: center;
    font-family: 'Lato', sans-serif;
    font-size: 260%;
    font-weight: 300;
    margin-left: auto;
    margin-right: auto;
    border-bottom: 2px solid #f31313; 
}

h3 {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 150%;
    margin-bottom: 5px;
    color: #f31313;
    
    
}


.square {
    height: 350px;
    width:29%;
    float: left;
    margin:80px 2%;
    overflow: hidden;
    
}

/* ----- MAGIC BOXES IN EVENT & CONTACT SECTION ----- */
.hideme
{
    /*
	    opacity:0;
	   */
}

/* ----- GALLERY SECTION ----- */

#gallery-section {
   
    background-attachment: fixed;
    height: auto;
}

.picture-sections {
    list-style: none;
    width:100%;
}

.picture-sections li {
    display: block;
    width:25%;
    float:left;
}

.picture {
    width:100%;
    margin:0;
    overflow: hidden;
    background-color: #000000;
}

.picture img {
    width:100%;
    height: auto;
    opacity: 0.7;
    transform: scale(1.15);
    transition: transform .5s, opacity .5s;
}

.picture img:hover {

    transform: scale(1.04);
    opacity: 1;
}




/* ----- CONTACT SECTION ----- */

#contact-section {
    width:100%;
    height:70px;
}

#contact-section h2 {

    margin-top:10px;
         width: 190px;
}
.contact-box {
    height: 200px;
    width:29%;
    float: left;
    margin:70px 2%;
    overflow: hidden;
}

.contact-box  li {
    text-align: center;
}


/* ----- FOOTER SECTION ----- */

footer {
    clear: both;
    background-color: #000;
    width:100%;
    height:50px;
    overflow: hidden;
}

footer h4 {
    font-family: 'Lato', sans-serif;
    font-weight: 300;
    font-size: 98%;
    color: #fff;
    text-align: center;
    padding-top: 10px;
}

.redLink {
	color: #f32f2f;
	font-weight: bold;
}