ul {
    margin:0;
    padding:0;
    text-decoration:none;
    list-style:none;
}
li {
    padding:0;
    margin:0;
}
nav {
    text-align:center;
    width:100%;
    position:relative;
    height:auto;
    overflow:hidden;
    background:none;
}
nav ul {
    text-align:center;
}
nav ul li {
    display:inline-block;
}
nav ul li a {
    color:#333;
    display:inline-block;
    padding:1em 3em;
    text-decoration:none;
    border-bottom:2px solid #fff;
    transition-property:all .2s linear 0s;
    -moz-transition:all .2s linear 0s;
    -webkit-transition:all .2s linear 0s;
    -o-transition:all .2s linear 0s;
    font-size:16px;
}
nav ul li a:hover {
    color: #34B484;
}
/*styling open close button*/
.button {
    display:inline;
    position:absolute;
    right:50px;
    top:6px;
    z-index:999;
    font-size:30px;
}
.button a {
    text-decoration:none;
}
.btn-open:after {
    color:#333;
    content:"\f0c9";
    font-family:"FontAwesome";
    transition-property:all .2s linear 0s;
    -moz-transition:all .2s linear 0s;
    -webkit-transition:all .2s linear 0s;
    -o-transition:all .2s linear 0s;
}
.btn-open:hover:after {
    color:#34B484;
}
.btn-close:after {
    color:#fff;
    content:"\f00d";
    font-family:"FontAwesome";
    transition-property:all .2s linear 0s;
    -moz-transition:all .2s linear 0s;
    -webkit-transition:all .2s linear 0s;
    -o-transition:all .2s linear 0s;
}
.btn-close:hover:after {
    color: #34B484;
}
/*overlay*/
.overlay {
    display:none;
    position:fixed;
    top:0;
    height:100%;
    width:100%;
    background:#333;
    overflow:auto;
    z-index:99;
}
.wrap {
    color:#e9e9e9;
    text-align:center;
    max-width:90%;
    margin:0 auto;
}
.wrap ul.wrap-nav {
    border-bottom:1px solid #575757;
    text-transform:capitalize;
    padding:150px 0px 100px;
}
.wrap ul.wrap-nav li {
    font-size:20px;
    display:inline-block;
    vertical-align:top;
    width:24%;
    position:relative;
}
.wrap ul.wrap-nav li a {
    color:#34B484;
    display:block;
    padding:8px 0;
    text-decoration:none;
    transition-property:all .2s linear 0s;
    -moz-transition:all .2s linear 0s;
    -webkit-transition:all .2s linear 0s;
    -o-transition:all .2s linear 0s;
}
.wrap ul.wrap-nav li a:hover {
    color:#f0f0f0;
}
.wrap ul.wrap-nav ul {
    padding:20px 0;
}
.wrap ul.wrap-nav ul li {
    display:block;
    font-size:13px;
    width:100%;
    color:#e9e9e9;
}
.wrap ul.wrap-nav ul li a {
    color:#f0f0f0;
}
.wrap ul.wrap-nav ul li a:hover {
    color:#34B484;
}
.social {
    font-size:25px;
    padding:20px;
}
.social p {
    margin:0;
    padding:20px 0 5px 0;
    line-height:30px;
    font-size:13px;
}
.social p a {
    color:#34B484;
    text-decoration:none;
    margin:0;
    padding:0;
}
.social-icon {
    width:80px;
    height:50px;
    background:#e9e9e9;
    color:#333;
    display:inline-block;
    margin:0 20px;
    transition-property:all .2s linear 0s;
    -moz-transition:all .2s linear 0s;
    -webkit-transition:all .2s linear 0s;
    -o-transition:all .2s linear 0s;
}
.social-icon:hover {
    background:#34B484;
    color:#f0f0f0;
}
.social-icon i {
    margin-top:12px;
}
@media screen and (max-width:48em) {
    .wrap ul.wrap-nav>li {
        width:100%;
        padding:20px 0;
        border-bottom:1px solid #575757;
    }
    .wrap ul.wrap-nav {
        padding:30px 0px 0px;
    }
    nav ul {
        opacity:0;
        visibility:hidden;
    }
    .social {
        color:#c1c1c1;
        font-size:25px;
        padding:15px 0;
    }
    .social-icon {
        width:100%;
        height:50px;
        background:white;
        color:black;
        display:block;
        margin:5px 0;
    }
}
.h1 {
    margin-right: 29%;
    font-family: 'Righteous', cursive;
}


.row,
.row > .column {
  padding: 8px;
}

/* Create three equal columns that floats next to each other */
.column {
  float: left;
  width: 33.33%;
  display: none; /* Hide all elements by default */
}

/* Clear floats after rows */ 
.row:after {
  content: "";
  display: table;
  clear: both;
}

/* Content */
.content {
  background-color: white;
  padding: 10px;
}

/* The "show" class is added to the filtered elements */
.show {
  display: block;
}

/* Style the buttons */
.btn {
  border: none;
  outline: none;
  padding: 12px 16px;
  background-color: white;
  cursor: pointer;
}

.btn:hover {
  background-color: #ddd;
}

.btn.active {
  background-color: #666;
  color: white;
}

.containerbg
{
    margin: 0px;
    padding: 0px;
    background:  #566573;
    padding-bottom: 40px;

}

.row1
{
    background: white;
    color: black;
    transform: skew(0deg,-5deg );
}

.row2
{
    background: white;
    color: black;
    transform: skew(0deg,-5deg);
}

.row.row1 {
    margin-top: 41px;
    margin-right: 1px;
    margin-left: 1px;
    margin-bottom: 53px;
}
.row.row2 {

    margin-left: 1px;
    margin-right: 1px;

}
.h5
{
   transform: skew(0deg,-5deg); 
}
.h6
{
   transform: skew(0deg,-5deg); 
}
.h5 {

    margin-top: -42px;
    font-size: 50px;
    padding-top: -1px;
    margin-left: 84px;
    margin-bottom: -18px;
    color: white;

}
.h6 {
    margin-left: 73%;
    margin-bottom: -44px;
    padding-top: -11px;
    padding-bottom: -4px;
    font-size: 50px;
    margin-top: -13px;
    color: white;
}
.container.gap1 {
    margin-top: -30px;
}
.p2 {

    font-size: 20px;
    margin-left: 20px;
    padding-top: 0px;

}
/*.card-img-top
{
    border-radius: 100px;
}*/

.md {

    margin-top: 3%;
        color: white;
margin-left: 20px;
}
.md1 {

    margin-top: 3%;
  
    color: white;
margin-left: 20px;
}
.col-md-3.br {
    border-left: solid orange;
}
.h10 {
    margin-left: 28px;
    color: orange;
}
.h9 {
    margin-top: 16%;
    margin-left: 23%;
    color: gray;
    font-family: 'Righteous', cursive;
}
.h11 {
    margin-left: 81px;
    color: gray;
    font-family: 'Righteous', cursive;
}

.h3 {
    margin-left: 43%;
    margin-top: 2%;
    margin-bottom: 2%;
    font-family: 'Abril Fatface', cursive;
}
.h2 {
    margin-top: 1%;
    margin-left: 35%;
     font-family: 'Abril Fatface', cursive;
}
.h7 {
    margin-left: 39%;
    margin-top: 2%;
    margin-bottom: 2%;
    font-family: 'Abril Fatface', cursive;
}
.h8 {

    margin-top: 2%;
    margin-bottom: 2%;
    margin-left: 35%;
     font-family: 'Abril Fatface', cursive;

}
.h13{

    margin-top: 2%;
    margin-bottom: 2%;
    margin-left: 45%;
 font-family: 'Abril Fatface', cursive;
}
.h3 {

    margin-left: 42%;
    margin-top: 2%;
    margin-bottom: 2%;
 font-family: 'Abril Fatface', cursive;
}
body
{
    font-family: 'ZCOOL XiaoWei', serif;
}
.btn {
    border: none;
    outline: none;
    padding: 12px 16px;
    background-color: #6f6767;
    cursor: pointer;
}
.mddd {

    margin-top: 1%;
}
.md3 {

    margin-top: 3%;
    margin-left: -15%;

}
.md4 {

    margin-top: 3%;
    margin-left: -21%;

}
.fixed-top.scrolling-navbar
{
    z-index: 1500px;
    background: white;
}
.h1 {
    margin-left: -17%;
    font-size: 0;
}
.h1 a
{
    font-size: 20px;
}