@charset "utf-8";

* {
	padding: 0;
	margin: 0;
}
body {
	font-family:Arial, Helvetica, sans-serif;
	font-size: 12px;
	font-family:Arial, Helvetica, sans-serif;
	color: #77787a;
	 background: url("../img/bodybg.png");
	 background-repeat:repeat-x;
}
a img {
	border: none;
}
a {
	color: #77787a;
	text-decoration: none;
}
a:hover {
	color: #77787a;
	text-decoration: underline;
}
ul, li, h1, h2, h3, h4, h5, h6, p, form {
	margin: 0;
	padding: 0;
}
ul li {
	list-style-position: outside;
	list-style-type: none;
}
.main {
	clear: both;
	width:100%;

}
.clear {
	clear: both;
	height: 0;
	font-size: 0;
	line-height: 0;
}
h1, h1 a {

	font-weight: normal;
	

}
h2, h2 a {

	font-weight: normal;
	

}
/*-------------------------------------Header-------------------------------------*/

.header {
	height: 185px;
	width:100%;
	margin: 0 auto;
}
.logo {
    float: left;
    height: 128px;
    padding-bottom: 7px;
    padding-top: 10px;
}
.social
{
float:right;
width:auto;
padding-top:17px;
}
.social img
{
margin-right:14px;
}

.search-div {
    float: left;
    margin-top: 29px;
    width: 744px;
}
.search
{
float:right;
 height: 40px;
padding-top:0px;
width:190px;
}

.search label {
    color: #666;
    display: block;
    float: left;
    font-size: 12px;
    line-height: 35px;
    padding-right: 12px;
    padding-top: 3px; 
    width: auto;
}

.searchinput {
    background: url("../img/searchbox.png") no-repeat scroll left center;
    border: 0 none;
    border-radius: 18px;
    float: left;
    height: 24px;
	color:#666;
    margin-top: 8px;
    padding-left: 6px;
    padding-top: 0;
    width: 120px;
}
.submit {
    background: url("../img/submit.png") no-repeat scroll right center / 23px auto rgba(0, 0, 0, 0);
    border: 0 none;
    cursor: pointer;
    float: left;
    height: 31px;
    margin-left: 6px;
    margin-top: 4px;
    width: 22px;
}


/*-------------------------------------content-------------------------------------*/



.banners {
    background: url("../img/banner.png") no-repeat scroll 0 center / 1000px auto #000000;
    height: 236px;
    margin: 0 auto;
    width: 999px;
}

.fl
{
float:left;
}
.fr
{
float:right;
}
.pt15
{
padding-top:15px;
}
.os img:hover
{

opacity:0.3;
}
.bannersright img:hover
{

opacity:0.3;
}

.os2
{
width:331px;
height:257px;
float:left;
clear:both;
margin-top:15px;

}
.os2 a
{
display:block;
width:331px;
height:257px;
background: url("../img/os2.png")

}
.os2 a:hover
{
display:block;
width:331px;
height:257px;
background: url("../img/os.png")
}
.fitnessop
{
float:left;
width:339px;
height:127px;
padding-top:15px;
}
.fitnessop a
{
display:block;
width:339px;
height:127px;
background: url("../img/opfitness.png")

}
.fitnessop a:hover
{
display:block;
width:339px;
height:127px;;
background: url("../img/op2fitness.png")
}
.opdigi
{
clear:both;
width:685px;
height:116px;
padding-top:15px;
}
.opdigi a
{
display:block;
width:685px;
height:116px;
background: url("../img/opdigi.png")

}
.opdigi a:hover
{
display:block;
width:685px;
height:116px;
background: url("../img/op2digi.png")
}

.optdem
{
float:right;
width:336px;
height:126px;
padding-top:15px;
}
.optdem a
{
display:block;
width:339px;
height:127px;
background: url("../img/optdem.png")

}
.optdem a:hover
{
display:block;
width:339px;
height:127px;;
background: url("../img/op2tdem.png")
}
.bannersright2
{
float:right;
width:685px;
}
.bannersright
{
float:right;
width:685px;
}

.content 
{

clear:both;
}

.bodycontent {
	clear: both;
margin:0 auto;
padding-top:0px;
	width: 900px;


}
.text
{
float:left;
/*width:590px;*/
}
/*.text p
{
padding-top:15px;
display:block;
clear:both;
}*/

/*.text h1
{
padding-top:15px;
display:block;
font-weight:bold;
font-size:18px;
color:#6eb43f;
clear:both;
}
.text h2 {
    clear: both;
    color: #6EB43F;
    display: block;
    font-size: 15px;
    font-weight: bold;
    padding-top: 15px;
}*/

.text h1 {
	font-family: 'Alegreya', serif;
	font-weight: 700;
	line-height: 34px;
	color:#55a51c;
	font-size: 32px;
	margin-top: 30px;
	margin-right: 0;
	margin-bottom: 30px;
	margin-left: 0;
    }
.text h2 {
    font-family: 'Roboto Condensed', sans-serif;
    font-weight: normal;
    font-size: 18px;
    line-height: 20px;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 23px 0;
    }
.text p {
    font-family: 'Roboto', sans-serif;
    font-size: 15px;
    line-height: 23px;
    margin: 0 0 23px 0;
    }

.top {
    float: right;
    margin-right: 20px;
    padding-top: 40px;
    width: 260px;
}
.clientbg
{
 background: url("../img/clientbg.png");
 background-repeat:repeat-x;
 background-position:bottom left;
 width:100%;
 height:171px;
 clear:both;
 margin-top:30px;
}
.client
{
width:900px;
margin:0 auto;
}
.clienttop
{
margin:0 auto;
width:330px;
height:24px;
}
.clientlogo
{
padding-top:15px;
clear:both;
}
.clientlogo img
{
float:left;
margin-right:86px;
}
.recomend
{
width:100%;
background:#e7e7e8;
height:77px;
clear:both;
}

.recomend h1 {
    clear: both;
    color: #626366;
    font-family: 'Alegreya',serif;
    font-size: 20px;
    font-weight: normal;
    height: 77px;
    line-height: 77px;
    margin: 0 auto;
    padding-top: 0;
    text-align: center;
    width: 1000px;
}

.recomend h5 {
    clear: both;
    color: #626366;
    font-family: 'Alegreya',serif;
    font-size: 24px;
    font-weight: normal;
    height: 77px;
    line-height: 77px;
    margin: 0 auto;
    padding-top: 0;
    text-align: center;
    width: 1000px;
}
/*-------------------------------------footer-------------------------------------*/
/*.footerbg
{
background:#58585a;
clear:both;
width:100%;
height:43px;
}
.footer {
	clear: both;
	padding-top:10px;
	width: 900px;
	margin: 0 auto;
	color:#FFF;

}


.copy
{
width:350px;
font-size:14px;
clear:both;
float:left;


}
.ProPlus
{
float:right;
width:500px;
text-align:right;
}


.ft-url {
    background-color: #FFFFFF;
    clear: both;
    color: #000000;
    float: left;
    font-size: 12px;
    margin: 17px auto;
    padding-top: 16px;
    text-align: center;
    width: 100%;
}
.ft-url a { text-decoration:underline; padding-left:28px; padding-right:28px; }*/
/************header login css */

.loghead {
    border-right: 1px solid #555;
    float: left;
    font-size: 14px;
    margin-right: 12px;
    margin-top: 5px;
    width: 137px;
}

.loghead a {
	
	
}
.loghead img {
    vertical-align: middle;
	 margin-right: 5px;
}

/****************form login css************/

#loginbox {
    border: 1px solid #999;
    border-radius: 5px;
    display: inline-block;
    font-size: 14px;
    line-height: 40px;
    max-width: 500px;
    padding: 20px;
    width: 100%;
	margin-bottom: 30px;
}

#loginbox .boxfiled {
    float: left;
    max-width: 500px;
    text-align: center;
    width: 100%;
}

#loginbox .logname {
    float: left;
    max-width: 120px;
    width: 100%;
}

#loginbox .logfield {
    float: left;
    max-width: 330px;
    width: 100%;
}

#loginbox input, #loginbox button, #loginbox select, #loginbox textarea {
    border: 1px solid #999999;
    border-radius: 5px;
    height: 20px;
    line-height: 30px;
    margin: 0 0 1%;
    max-width: 350px;
    padding: 1% 1% 1% 8px;
    width: 92%;
}


*::before, *::after {
    box-sizing: border-box;
}
*::before, *::after {
    box-sizing: border-box;
}
#loginbox input[type="submit"] {
    background-color: #818285;
     background-position: 65px 4px;
    border: 0 none;
    color: #ffffff;
    font-weight: 600;
    height: 30px;
    line-height: 16px;
    margin: 8px 30px 0 127px;
    max-width: 100px;
    padding-right: 30px;
}
/****************after user login****************************/
#userfiles .opencat, #memfile .opencat {
    border-bottom: 1px solid;
    color: #000;
    font-family: "Open Sans",sans-serif;
    font-size: 17px;
	clear:both;
    font-weight: bold;
}

.toleft.main-content ul { padding-left:0px; list-style:inside ;
	
}
.toleft.main-content ul li {
	font:normal 16px 'Open Sans', sans-serif;
	background: url("/img/bullet.png") no-repeat 0 center;
	border-bottom: 1px solid #eee;
	display: inline-block;
	*display: inline;
	line-height: 24px;
	list-style: circle outside none;
	padding: 0 0 5px 20px;
	text-align: left;
	width: 100%;
	*zoom: 1.0;
}


    /* PDF document links */
#userfiles a[href$='.pdf'] {
 background: url("../img/pdf.png") no-repeat scroll left center / 32px auto transparent;
    display: inline-block;
background:-size:40px;
 line-height: 50px;
    padding-left: 50px;
}
 
/* Excel Documents links */
#userfiles a[href$='.xlsx'], a[href$='.xls'], a[href$='.csv'], a[href$='.xlw'], a[href$='.xlt'] {
background:transparent url("../img/excel.png") center left no-repeat;
display:inline-block;
background:-size:40px;
 line-height: 50px;
    padding-left: 50px;
}
 
/* Word Document Links */
#userfiles a[href$='.docx'], a[href$='.doc'], a[href$='.rtf'], a[href$='.wps'], a[href$='.txt'] {
background:transparent url(../img/word.png) center left no-repeat;
display:inline-block;
background:-size:40px;
 line-height: 50px;
    padding-left: 50px;
}

 /************Colors css***********/
	 
	 #memfile .row a {
		 display:inline-flex;
		 margin:15px;
		 padding:0px;
		 color:#fff;
		 text-decoration:none;
		 
		 height:150px;
		 
	border-radius: 50%;
    text-align: center;
    max-width: 150px;
	width: 100% !important;
	 background-color: #e22319;
    box-shadow: 30px 0 1px #b81e17 inset;
	 
		 
	 }
	 #memfile .row a div {
    font-size: 25px;
    font-weight: bold;
    line-height: 27px;
    margin-top: 56px;
    width: 100%;
}

#memfile .row span {
    display: block;
    font-size: 17px;
    font-weight: normal;
    line-height: 17px;
    margin-top: 3px;
}

	 
 .circle-red {
    background-color: #e22319 !important;
    box-shadow: 30px 0 1px #b81e17 inset !important;
    
}

 .circle-blue {
    background-color: #009BD7 !important;
    box-shadow: 30px 0 1px #0080B2 inset !important;
    
}
 .circle-yellow { 
    background-color: #FFF100 !important;
    box-shadow: 30px 0 1px #CFC701 inset !important;
    
}
 .circle-black {
    background-color: #000 !important;
    box-shadow: 30px 0 1px #404041 inset !important;
    
}
 .circle-green {
    background-color: #00704A !important;
    box-shadow: 30px 0 1px #005C3D inset !important;
    
}