@charset "utf-8";
/* scroll bar style */
body {
	background-color: #fff;
}
::-webkit-scrollbar {
  width: 6px;
	background-color: #F5F5F5;
}

 
::-webkit-scrollbar-track {
 -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3);
	background-color: #F5F5F5;
}
 
 
::-webkit-scrollbar-thumb {
  background-color: #000000;
}

 
::-webkit-scrollbar-thumb:hover {
  background: #b30000; 
}

.noscroll::-webkit-scrollbar {display: none;}


/*Wrapping Box Style*/
.box5  { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:5%;float:left;position:relative;  } 
.box10 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:10%;float:left;position:relative; } 
.box15 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:15%;float:left;position:relative; } 
.box20 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:20%;float:left;position:relative; } 
.box25 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:25%;float:left;position:relative; } 
.box30 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:30%;float:left;position:relative; } 
.box35 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:35%;float:left;position:relative; } 
.box40 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:40%;float:left;position:relative; } 
.box45 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:45%;float:left;position:relative; } 
.box50 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:50%;float:left;position:relative; } 
.box55 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:55%;float:left;position:relative; } 
.box60 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:60%;float:left;position:relative; } 
.box65 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:65%;float:left;position:relative; } 
.box70 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:70%;float:left;position:relative; } 
.box75 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:75%;float:left;position:relative; } 
.box80 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:80%;float:left;position:relative; } 
.box85 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:85%;float:left;position:relative; } 
.box90 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:90%;float:left;position:relative; } 
.box95 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:95%;float:left;position:relative; } 
.box100 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:100%;float:left;position:relative; } 
.box33 { font-family: "Roboto", sans-serif;font-optical-sizing: auto;width:33.333333333333%;float:left;position:relative; } 

/*padding and flex*/
.hc		{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;display:flex;justify-content:center;}
.hl		{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;display:flex;justify-content:left;}
.hr		{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;display:flex;justify-content:right;}
.vc		{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;display:flex;align-items:center;}
.vl		{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;display:flex;align-items:left;}
.vr		{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;display:flex;align-items:right;}
.pad5			{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;padding:5px;}
.pad10			{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;padding:10px;}
.pad15			{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;padding:5px;}
.pad20			{ font-family: "Roboto", sans-serif;font-optical-sizing: auto;padding:20px;}

/*line and radius and shadowing*/
.rad5			{ border-radius:5px;}
.rad10			{ border-radius:10px;}
.rad50			{ border-radius:50%;}
.shad 			{ box-shadow: 5px 5px 5px -7px rgba(0,0,0,0.75);}
.boxred			{ border:1px solid  #c0392b;}
.boxgreen		{ border:1px solid  #27ae60;}
.boxblue		{ border:1px solid  #2980b9;}

/*button*/
.btnblue        { background:#ad6bca;color:#fff;border:2px solid #ad6bca;padding:10px;text-align:center;border-radius:20px;} 
.btnwire        { background:#fff;border:2px solid #ad6bca;color:#ad6bca;padding:10px;text-align:center;border-radius:20px;} 
.btnred         { background:#e74c3c;margin-right:10px;border:1px solid #e74c3c;margin-top:6px;text-align:center;cursor:pointer;
                   color:#FFFFFF;font-size:13px;font-weight:400;border-radius:5px;box-shadow: 5px 5px 5px -7px rgba(0,0,0,0.75);height:35px;} 
.btngreen       { background:#2ecc71;margin-right:10px;border:1px solid #2ecc71;margin-top:6px;text-align:center;cursor:pointer;
				   color:#FFFFFF;font-size:13px;font-weight:400;border-radius:5px;box-shadow: 5px 5px 5px -7px rgba(0,0,0,0.75);height:35px;} 
.btnyellow      { background:#e67e22;margin-right:10px;border:1px solid #e67e22;margin-top:6px;text-align:center;cursor:pointer;
                  color:#FFFFFF;font-size:13px;font-weight:400;border-radius:5px;box-shadow: 5px 5px 5px -7px rgba(0,0,0,0.75);height:35px;} 

.btnblue:hover         { opacity:0.5;background:#ad6bca;color:#fff;border:2px solid #ad6bca;padding:10px;text-align:center;border-radius:20px;} 
.btnwire:hover         { opacity:0.5;background:#fff;border:2px solid #ad6bca;color:#ad6bca;padding:10px;text-align:center;border-radius:20px;} 
.btnred:hover         { background:#e74c3c;margin-right:10px;border:1px solid #e74c3c;margin-top:6px;text-align:center;cursor:pointer;
                        opacity:0.8;color:#FFFFFF;font-size:13px;font-weight:400;border-radius:5px;box-shadow: 5px 5px 5px -7px rgba(0,0,0,0.75);height:35px;} 
.btngreen:hover       { background:#2ecc71;margin-right:10px;border:1px solid #2ecc71;margin-top:6px;text-align:center;cursor:pointer;
				        opacity:0.8;color:#FFFFFF;font-size:13px;font-weight:400;border-radius:5px;box-shadow: 5px 5px 5px -7px rgba(0,0,0,0.75);height:35px;} 
.btnyellow:hover      { background:#e67e22;margin-right:10px;border:1px solid #e67e22;margin-top:6px;text-align:center;cursor:pointer;
                        opacity:0.8;color:#FFFFFF;font-size:13px;font-weight:400;border-radius:5px;box-shadow: 5px 5px 5px -7px rgba(0,0,0,0.75);height:35px;} 
						
/*input*/
textarea 			  { font-family: "Roboto", sans-serif;font-optical-sizing: auto;background:#fff;
                   		border:1px solid #ddd; font-size:12px;color:#666;padding:3px; width:98%;border-radius:3px;}
input 				  { border:none;font-family: "Roboto", sans-serif;padding:5px;font-optical-sizing: auto;background:#fff;
                 		border-bottom:1px solid  #666666; font-size:12px;color:#666;padding:3px; height:30px;width:100%;border-radius:0px; }  
input:focus     	  { outline:none;}
select 				  { border:none;font-family: "Roboto", sans-serif;padding:5px;font-optical-sizing: auto;background:#fff;
                 		border-bottom:1px solid  #666666; font-size:12px;color:#666;padding:3px; height:30px;width:100%;border-radius:0px; }  
select:focus     	  { outline:none;}
 
/*fonted*/
.f10 {font-size:10px;}
.f11 {font-size:11px;}
.f12 {font-size:12px;}
.f13 {font-size:13px;}
.f14 {font-size:14px;}
.f16 {font-size:16px;}
.f16 {font-size:16px;}
.f17 {font-size:17px;}
.f18 {font-size:18px;}
.f19 {font-size:19px;}
.f20 {font-size:20px;}
.clr1 { color:#eadaf4;}
.clr2 { color:#dbbdea;}
.clr3 { color:#c695dd;}
.clr4 { color:#ad6bca;}
.clr5 { color:#9b59b6;}
.clrb { color:#000;}
.bold { font-weight:bold;}


@media screen and (max-width: 768px) {}
@media screen and (max-width: 992px) {}
@media screen and (max-width: 568px) {}