* {outline:none;}

html, body {
         margin:0px;
         padding:0px;
         height:100%;
         width:100%;
         background:#eee;
         color:#212529;
         font-family:'Lato';
         font-size:16px;
         line-height:30px;
}

.wrapper {
         max-width:1000px;
         position:relative;
         margin:0px auto 0px auto;
}

.floatLeft {float:left;}
.floatRight {float:right;}
.clear {clear:both;}

@media screen and (max-width:768px) {
         .wrapper, h1  {
                 width:90%;
                 margin:0px 5% 0px 5%;
         }

         h1 {
                 text-align:center;
                 line-height:45px;
         }

         .floatLeft, .floatRight {
                 width:100%;
         }
}

h1 {
         color:#fff;
         background:#D31B33;
         padding:40px 20px;
         text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
         text-transform:uppercase;
         font-weight:bold;
         font-size:35px;
         position:relative;
}

h1:after {
         position:absolute;
         top:-10px;
         left:-10px;
         width:calc(100% + 10px);
         height:calc(100% + 10px);
         border:5px solid #D31B33;
         content:"";
}

#navBar {
         width:100%;
         position:fixed;
         z-index:999;
         top:0px;
         background:#929193;
         color:#2c2c2c;
         border-top:10px solid #D31B33;
         padding:10px 0px 10px 0px;
         -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
         -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
         box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.75);
}

#navBar #navBarFirst {
         display:none;
}

#navBar #navBarSecond {
         float:left;
}

#navBar #navBarSecond img {
         width:170px;
}

#navBar #navBarThird {
         float:left;
         position:relative;
         border-left:1px solid #D31B33;
         margin:40px 0px 0px 30px;
         padding:0px 0px 0px 30px;
}

#navBar:after {
    bottom: 0;
    content: '';
    height: 100%;
    position: absolute;
    right: -15px;
    transform: skewX(-15deg);
    width: 25%;
    z-index: -1;
    background-color: #79777a;}

#navBar #navBarThird ul {
         padding:0px;
         margin:0px;
}

#navBar #navBarThird ul li:first-child {
         display:none;
}

#navBar #navBarThird ul li {
         list-style:none;
         float:left;
         margin:0px 10px 0px 10px;
         padding:0px 10px 0px 0px;
}

#navBar #navBarThird ul li:last-child {
         border-right:none;
}

#navBar #navBarThird ul li a {
         color:#fff;
         text-decoration:none;
         text-transform:uppercase;
         font-weight:bold;
         font-size:14px;
         position:relative;
         text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
         -moz-transition: all .4s ease-in;
         -o-transition: all .4s ease-in;
         -webkit-transition: all .4s ease-in;
         transition: all .4s ease-in;
}

#navBar #navBarThird ul li a::before {
         content: "";
         position: absolute;
         width: 100%;
         height: 2px;
         bottom: -3px;
         left: 0px;
         background-color: #fff;
         visibility: hidden;
         transform: scaleX(0);
         transition: all 0.2s ease-in-out 0s;
}

#navBar #navBarThird ul li a:hover::before {
         visibility: visible;
         transform: scaleX(1);
}

#navBar #navBarThird ul li ul {
         display:none;
}

                 /********** MIN. 320px - MAX. 1024px **********/
                 @media screen and (max-width:768px) {

                 #navBar {
                         height:45px;
                 }

         #navBar #navBarFirst {
                 display:block;
                 position:absolute;
                 top:7px;
                 left:10px;
         }

         #navBar #navBarFirst .navOpenBtn {
                  width:15px;
                  padding:9px 8px 9px 8px;
                  background:#fff;
                  -webkit-border-radius: 100%;
                  -moz-border-radius: 100%;
                  border-radius: 100%;
                  -moz-transition: all .4s ease-in;
                  -o-transition: all .4s ease-in;
                  -webkit-transition: all .4s ease-in;
                  transition: all .4s ease-in;
                  cursor:pointer;
                  position:relative;
                  display:block;
         }

         #navBar #navBarFirst .navOpenBtn span {
                  position: relative;
                  display: inline-block;
                  width: 100%;
                  height: 7px;
                  border-top: 3px solid #D31B33;
                  border-bottom: 3px solid #D31B33;
                  -webkit-border-radius: 2px;
                  -moz-border-radius: 2px;
                  border-radius: 2px;
         }

         #navBar #navBarFirst .navOpenBtn span:before {
                  content: "";
                  position: absolute;
                  top: 2px;
                  left: 0px;
                  width: 100%;
                  border-top: 3px solid #D31B33;
         }

         #navBar #navBarThird ul li:first-child {
                 display:block;
         }

         #navBar nav#navBarThird ul {
                  width:300px;
                  z-index:9999;
                  position:fixed;
                  left:-370px;
                  top:0px;
                  background:rgba(255, 255, 255, 1);
                  height:100%;
                  -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.8);
                  -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.8);
                  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.8);
                  margin:0px;
                  padding:0px;
                  overflow-y:auto;
                  overflow-x:hidden;
         }

         #navBar nav#navBarThird ul li {
                  list-style:none;
                  width:100%;
                  padding:0px;
                  margin:0px;
                  position:relative;
         }

         #navBar nav#navBarThird ul li a {
                  display:block;
                  border-bottom:1px solid #eeeeee;
                  text-decoration:none;
                  text-transform:uppercase;
                  font-weight:bold;
                  width:370px;
                  padding:10px 10px 10px 25px;
                  font-size:12px;
                  color:#2c2c2c;
                  text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.0);
         }

         #navBar nav#navBarThird ul li a:hover,
         #navBar nav#navBarThird ul li.active a {
                  background:rgba(255, 220, 55, 1);
                  color:#fff;
                  text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
         }

         #navBar nav#navBarThird ul li.current-menu-item a {
                  font-weight:bold;
                  border-bottom:0px;
         }

         #navBar nav#navBarThird ul li.close a {
                  background:#D31B33;
                  padding:20px 10px 10px 25px;
                  height:40px;
                  color:#ffffff;
                  text-shadow: 0px 0px 0px rgba(0, 0, 0, 0.0);
                  font-weight:bold;
                  cursor:pointer;
         }

         #navBar nav#navBarThird ul li.close a .close-icon {
                  width:20px;
                  height:20px;
                  -webkit-border-radius: 10px;
                  -moz-border-radius: 10px;
                  border-radius: 10px;
                  display:block;
                  background:rgba(255, 255, 255, 1);
                  position:relative;
                  top:5px;
                  margin-right:10px;
                  display:inline-block;
                  overflow:hidden;
         }

         #navBar nav#navBarThird ul li.close a .close-icon:before,
         #navBar nav#navBarThird ul li.close a .close-icon:after {
                  content: '';
                  position:absolute;
                  height:2px;
                  width:10px;
                  top:50%;
                  left:26%;
                  margin:-1px 0px 0px 0px;
                  background:#D31B33;
         }

         #navBar nav#navBarThird ul li.close a .close-icon:before {
                  transform: rotate(45deg);
         }

         #navBar nav#navBarThird ul li.close a .close-icon:after {
                  transform:rotate(-45deg);
         }

         #navBar #navBarSecond {
                 clear:both;
                 justify-content:center;
                 align-items: center;
                 display:flex;
                 position:absolute;
                 top:0px;
                 left:50%;
                 margin-left:-35px;
                 width:70px;
         }

         #navBar #navBarSecond img {
                 width:70px;
         }


                 }

header {
         background:url('img/slide.jpg') center center no-repeat;
         width:100%;
         height:500px;
         justify-content:center;
         align-items: center;
         display:flex;
}

a.bigBTN {
         color:#fff;
         text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
         padding:30px 50px;
         font-size:25px;
         text-decoration:none;
         text-transform:uppercase;
         background:#D31B33;
         display:block;
         text-align:center;
         justify-content:center;
         align-items: center;
         position:relative;
}

a.bigBTN:after {
         border:1px solid #fff;
         content:"";
         position:absolute;
         top:2px;
         left:2px;
         width:calc(100% - 6px);
         height:calc(100% - 6px);
}

         @media screen and (max-width:768px) {
                  a.bigBTN {
                         width:calc(100% - 100px);
                         margin:10px 0px;
                  }
         }

#content {
         width:100%;
         margin-top:-100px;
}

#content .content {
         background:#fff;
         width:calc(100% - 50px);
         padding:25px;
         margin:0px 0px 50px 0px;
}

#content .content .floatLeft {
         width:calc(50% - 25px);
         padding-right:25px;
}

#content .content .floatRight {
         width:calc(50% - 25px);
         padding-left:25px;
}

#content #aboutus {
         position:relative;
         width:100%;
         margin-bottom:50px;
}

#content #aboutus .floatLeft {
         background-position-x: 50%;
         background-position-y: 50%;
         background-size: cover;
         width: 60%;
         background:url('img/main.png') no-repeat;
         height:400px;
         position:relative;
         z-index:1;
         -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
         -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
         box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
}

#content #aboutus .floatLeft:after {
         width:calc(100% - 20px);
         height:calc(100% - 20px);
         border:5px solid #fff;
         content:"";
         position:absolute;
         top:5px;
         left:5px;
         z-index:2;
}

#content #aboutus .floatRight {
         width:calc(50% - 70px);
         padding:10px 35px;
         background:#fff;
         -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
         -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
         box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
         position:absolute;
         right:0px;
         top:35px;
         z-index:2;
}

#content #aboutus .floatRight:after {
         width:calc(100% + 10px);
         height:calc(100% + 10px);
         border:5px solid #fff;
         content:"";
         position:absolute;
         top:-10px;
         left:-10px;
         z-index:2;
}

#content .content.gallery {
         justify-content:space-between;
         display: flex;
}

#content .content.gallery img {
         width:130px;
}

@media screen and (max-width:768px) {
         #content {
                 width:90%;
                 margin:-100px 5% 100px 5%;
         }

         #content .content .floatLeft {
                 width:calc(100% - 50px);
                 padding:25px;
         }

         #content .content .floatRight {
                 width:calc(100% - 50px);
                 padding:25px;
         }

         #content #aboutus .floatLeft {
                  width: 100%;
         }

         #content #aboutus .floatRight {
                  width:calc(100% - 70px);
                  padding:10px 35px;
                  background:#fff;
                  -webkit-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
                  -moz-box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
                  box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.5);
                  position:relative;
                  left:0%;
                  top:-100px;
                  z-index:2;
         }

         #content #aboutus .floatRight:after {
                  width:calc(100% + 10px);
                  height:calc(100% + 10px);
                  border:5px solid #fff;
                  content:"";
                  position:absolute;
                  top:-10px;
                  left:-10px;
                  z-index:2;
         }

         #content .content.gallery {
                 justify-content:space-between;
                 display: block;
         }
}

footer {
         background:#929193;
         width:100%;
         padding:50px 0px;
         margin-top:50px;
}

footer h3 {
         font-size:25px;
}

footer a {
         text-decoration:none;
         color:#fff;
         text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
}

footer ul {
         margin:0px;
         padding:0px;

}

footer ul li {
         list-style:none;

}

footer .first, footer .second, footer .third, footer .fourth {
         float:left;
         color:#fff;
         text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5);
         margin-right:40px;
}

footer .first img {
         width:100%;
}

footer .first {
         width:150px;
}

footer .fourth {
         margin-right:0px;
}

footer .second ul li {
         margin:0px 0px 15px 0px;
}

footer .second ul li div {
         color:#D31B33;
         text-transform:uppercase;
         text-shadow: 0px 0px 0px rgba(0, 0, 0, 0);
         font-weight:bold;
}

footer .third ul li {
         float:left;
}

footer .third ul li a {
         background:#D31B33;
         -webkit-border-radius: 5px;
         -moz-border-radius: 5px;
         border-radius: 5px;
         padding:5px;
         width:30px;
         height:30px;
         margin:0px 5px 0px 0px;
         display:flex;
         justify-content:center;
         align-items: center;
}

footer .third ul li a:hover {
         background:#b1172b;
}

footer .fourth ul li {
         padding:0px 0px 0px 30px;
         position:relative;
}

footer .fourth ul li:before {
         background:#D31B33;
         -webkit-border-radius: 100%;
         -moz-border-radius: 100%;
         border-radius: 100%;
         height:6px;
         width:6px;
         position:absolute;
         top:11px;
         left:4px;
         content:"";
}

footer .fourth ul li:after {
         border:2px solid #D31B33;
         -webkit-border-radius: 100%;
         -moz-border-radius: 100%;
         border-radius: 100%;
         height:10px;
         width:10px;
         position:absolute;
         top:7px;
         left:0px;
         content:"";
}

footer .fourth ul li a {
         font-weight:bold;
         text-transform:uppercase;
}

@media screen and (min-width:571px) and (max-width:768px) {
         footer .first, footer .second, footer .third, footer .fourth {
                 width:40%;
         }
}

@media screen and (max-width:570px) {
         footer .first, footer .second, footer .third, footer .fourth {
                 width:100%;
         }
}