@import url('https://fonts.googleapis.com/css2?family=Raleway:wght@300;400;500;600;700;800;900&display=swap');
/*font-family: 'Raleway', sans-serif;*/
@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans:wght@300;400;500;600&display=swap');
/*font-family: 'IBM Plex Sans', sans-serif;*/
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600;700&display=swap');
/*font-family: 'Montserrat', sans-serif;*/

*{
	box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-ms-box-sizing: border-box;
}
.clear{ clear: both; }
.clear:after{ clear: both; position: relative; display: table; width: 100%; 
	content: "";
}
.container{max-width: 1170px; margin: 0 auto;}
body{margin: 0; font-family: 'Raleway', sans-serif; background: #000;}
p{ margin: 0 0 15px; }
h1,h2,h3,h4,h5,h6{ margin: 0; font-family: 'Raleway', sans-serif;}
.tophd{ text-align: center; margin: 0 0 20px;}
h2.title{font-weight: 300; font-size: 45px; line-height: 50px; text-transform: initial; 
	padding: 0 0 22px; position: relative; display: inline-block;
}
h2.title:after{
	position: absolute;
	content: "";
	width: 35px;
	height: 4px;
	background: #f23431;
	left: 50%;
	bottom: 0;
	transform: translate(-50%,0);
	-webkit-transform: translate(-50%,0);
}
h2.title span{ display: inline-block; font-weight: bold;}
a,img{ transition: 0.5s; -webkit-transition:0.5s; }
a:hover{ text-decoration: none; }
section{ padding: 40px 0; }
/**header**/
 

/**menu**/
.menu{
	position: fixed; right: 10px; top: 10px;
}

.header-right .menu{ display: inline-block; vertical-align: middle; line-height: 0; }
.menu .menubtn{ width: 32px; height: 32px; display: inline-block;
	background: url(../images/menu.png) no-repeat 0 0;
}
.menu .menubtn:hover{background: url(../images/menu1.png) no-repeat 0 0;}
.menuholder{ position: fixed; right: 0; top: 0; z-index: 123; width:250px;
	height: 100%;  transition: 0.5s;
} 
.menuholder:after{
	position: fixed; left: 0; top: 0; width: 100%; height: 100%; background: rgba(0,0,0,0.7);
	z-index: 1; content: ""; opacity: 0; pointer-events: none; transition: 0.5s;
}
.menuholder >div{position: relative; z-index: 2; height: 100%;  background: #33bb50;}
.menuholder{ right: -250px; }
.menuholder.menuholderadd{ right: 0; }
.menuholder.menuholderadd:after{
	opacity: 1; pointer-events: initial;
}
.menuholder.menuholderadd .cross{ display: inline-block; }
.menuholder .cross{width: 32px;
    height: 32px;
    display: inline-block;
    background: url(../images/cross.png) no-repeat 0 0;
    position: absolute;
    left: -41px;
    top: 18px;
    display: none;
}


.menuholder h3{ margin: 0; padding: 12px 10px; text-align: center; font-size: 25px; 
	text-transform: uppercase; font-weight: bold; background: #fff; color: #000;
}
.menuholder ul{list-style: none; margin: 0; padding: 0;}
.menuholder ul li{border-bottom: 1px dashed rgba(255,255,255,0.5); position: relative;}
.menuholder ul li a{ display: block; padding: 8px 12px; color: #fff; text-transform: capitalize;
	font-weight: 600; position: relative; text-decoration: none;
}
.menuholder ul li a:hover{
	background: transparent;
}
.menuholder ul li .newadd{
    position: absolute;
    right: 0;
    top: 0; 
    color: #fff;
    width:35px; height: 100%;
    text-align: center;
    cursor: pointer;
    background: #239836;
}
.menuholder ul li .newadd:after{
	position: absolute;
	left: 44%; top: 50%;
	content: "";
	transform: translate(-50%,-50%) rotate(-45deg);
	 padding: 5px;
    border-color:#B32226;
    border-width: 0 2px 2px 0;
    border-style: solid;
}

.submenu{
    background: #2da547;
    position: fixed;
    width: 250px;
    z-index: 1;
    height: 100%;
    top: 0;
    right: -250px;
    transition: 0.5s;
}
.submenu1{right: 0;}
.submenu h3{ margin: 0; padding: 12px 10px;  font-size: 16px; 
	position: relative;
	text-transform: capitalize; font-weight: bold; background: #B52326; color: #fff; border-bottom: 1px dashed #fff;
}  
.menuholder .submenu li a{padding-left: 25px;}
.subcross{
    position: absolute;
    right: 0;
    top: 0; 
    color: #B52326;
    width:35px; height: 100%;
    text-align: center;
    cursor: pointer;
    background: #11408a;
}
.subcross:after{
	position: absolute;
	left: 44%; top: 50%;
	content: "";
	transform: translate(-50%,-50%) rotate(-45deg);
	 padding: 5px;
     color:#B52326;
  border-width: 0 2px 2px 0;
    border-style: solid;
}
