@font-face {
	font-family: 'Roboto-Condensed';
	src: url('../fonts/Roboto-Condensed');
    src: local('☺'), url('../fonts/Roboto-Condensed.woff') format('woff'),
     url('../fonts/Roboto-Condensed.ttf') format('truetype'), 
     url('../fonts/Roboto-Condensed.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'Roboto-Regular';
	src: url('../fonts/Roboto-Regular.eot');
    src: local('☺'), url('../fonts/Roboto-Regular.woff') format('woff'), 
    url('../fonts/Roboto-Regular.ttf') format('truetype'), 
    url('../fonts/Roboto-Regular.svg') format('svg');
	font-weight: normal;
	font-style: normal;
}

@font-face {
    font-family:'Bebas';
    src: url('../fonts/Bebas.eot');
	src: url('../fonts/Bebas.eot?#iefix') format('embedded-opentype'),
		url('../fonts/Bebas.woff2') format('woff2'),
		url('../fonts/Bebas.woff') format('woff'),
		url('../fonts/Bebas.ttf') format('truetype'), 
		url('../fonts/Bebas.svg#Bebas') format('svg');
    font-weight: 400;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-007E;
}

@font-face {
    font-family:'Myriad Pro Light';
    src: url('../fonts/MyriadPro-Light.eot');
	src: url('../fonts/MyriadPro-Light.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-Light.woff2') format('woff2'),
		url('../fonts/MyriadPro-Light.woff') format('woff'),
		url('../fonts/MyriadPro-Light.ttf') format('truetype'),
		url('../fonts/MyriadPro-Light.svg#MyriadPro-Light') format('svg');
    font-weight: 300;
    font-style: normal;
    font-stretch: normal;
    unicode-range: U+0020-00FE;
}

@font-face {
    font-family:'Myriad Pro Cond';
    src: url('../fonts/MyriadPro-Cond.eot');
	src: url('../fonts/MyriadPro-Cond.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-Cond.woff2') format('woff2'),
		url('../fonts/MyriadPro-Cond.woff') format('woff'),
		url('../fonts/MyriadPro-Cond.ttf') format('truetype'),
		url('../fonts/MyriadPro-Cond.svg#MyriadPro-Cond') format('svg');
    font-weight: 400;
    font-style: normal;
    font-stretch: condensed;
    unicode-range: U+0020-00FE;
}

@font-face {
    font-family:'Myriad Pro SemiboldCond';
    src: url('../fonts/MyriadPro-SemiboldCond.eot');
	src: url('../fonts/MyriadPro-SemiboldCond.eot?#iefix') format('embedded-opentype'),
		url('../fonts/MyriadPro-SemiboldCond.woff2') format('woff2'),
		url('../fonts/MyriadPro-SemiboldCond.woff') format('woff'),
		url('../fonts/MyriadPro-SemiboldCond.ttf') format('truetype'),
		url('../fonts/MyriadPro-SemiboldCond.svg#MyriadPro-SemiboldCond') format('svg');
    font-weight: 600;
    font-style: normal;
    font-stretch: condensed;
    unicode-range: U+0020-00FE;
}


body { margin:0; padding:0; background:#fff;}

.clear { margin:0; padding:0; clear:both;}
.flt-lft { float:left;}
.flt-rht { float:right;}
.bdr-none { border:none;}
a { text-decoration:none; outline:none}

.container { margin:0 auto; border:1px solid #ccc; max-width:700px;}

.header { margin:0; padding:0; float:left; width:100%; height:50px; background:url(../images/header-bg.jpg) no-repeat top left}
.header .page-title { margin:0; padding:8px 0; float:left; width:85%; text-align:center; font-family:'Bebas'; font-size:1.5em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.header .quick-share { margin:0; padding:15px 0 0 0; width:15%; float:left; text-align:center;}
.header .quick-share ul { margin:0; padding:0; width:100%; display:inline-block; text-align:center;}
.header .quick-share ul li { margin:0; padding:0 15px; list-style:none; float:left;} 
.header .quick-share ul li a { text-decoration:none; font-size:1.2em; color:#fff;}

.wrapper { margin:0; padding:0; width:100%; float:left;}
.fluid-container { margin:0; padding:5%; width:90%; background:#f1f1f1; display: inline-block;}

.userinfo-wrap { margin:0; padding:2%; width:96%; border-radius:1px; background:#ffffff; display: inline-block; box-shadow:0px 0px 9px 2px #888;}
.userinfo-wrap .clientpic { margin:0; padding:0; float:left; width:200px; text-align:center; height:200px; background-color:#800000; border-radius:5px;}
.userinfo-wrap .clientpic img { width:200px; height:200px; border-radius:5px;}
.userinfo-wrap .user-info { margin:0; padding:10px 0 0 5%; float: left; width:61%; }
.userinfo-wrap .user-info h1 { margin:0; padding:0; text-align:left; font-family: 'Myriad Pro Cond'; font-size:1.5em;  color:#000;}
.userinfo-wrap .user-info h6  { margin:0; padding:0; text-align:left; font-family: 'Myriad Pro Light'; font-size:1em;  color:#666;}
.userinfo-wrap .user-info h5 { margin:0; padding:20px 0; float:left; width:100%; text-align:left; line-height: 1.3em; font-family: 'Myriad Pro Light'; font-size:1.3em; color:#000;}

.fluid-container .client-info { margin:0; padding:20px 0 0 0; width:100%; float:left;}
.fluid-container .client-info p { border-left: 5px solid #4C9CCF; margin:0 0 10px 0; padding:2% 3% 3% 3%; display: block; background: #101010; border-radius: 2px; width:94%; text-align:left; font-family: 'Roboto-Condensed'; font-size:1.2em; color:#fff; cursor:pointer;}
.fluid-container .client-info p a { text-decoration:none; color:#4C9CCF;}
.fluid-container .client-info p i { font-size:1.2em; color:#f1f1f1;}

.fluid-container .follow-wrap { margin:20px 0 0 0; padding:0; float:left; width:100%;}
.fluid-container .follow-wrap h1 { margin:0; padding:0 0 10px 0; text-align:left; font-family: 'Myriad Pro SemiboldCond'; font-size:1.5em;  color:#000;}

.fluid-container .followus { margin:0; padding:0; float:left; width:50%; text-align:left; }
.fluid-container .followus ul { margin:0; padding:0; width:100%; display: inline-block;}
.fluid-container .followus ul li  { list-style:none; margin:0; padding:0 10px; float:left;}
.fluid-container .followus ul li a { text-decoration:none; font-size:1.2em; color:#4C9CCF;}
.fluid-container .paynow { margin:0; padding:0 0 0 10%; float:left; width:39%; border-left:1px solid #ccc;}

.client-services { margin:0; padding:2%; float: left; width:96%; background: linear-gradient(#fd0000, #800001);}
.client-services h1 { margin:0; padding:0; width:100%; text-align:center; font-family: 'Roboto-Condensed'; font-size:1.5em; color:#fff;}
.client-services ul { margin:20px 0 0 0; padding:0; width:100%;}
.client-services ul li { list-style:none; margin:0; padding:5px 12px 5px 12px; text-align:left; display:inline-block; font-family: 'Roboto-Regular'; font-size:0.9em; color:#fff; }
.client-services ul li:last-child { border:none;}
.client-services { padding: 5% 2%;}
.client-services ul { margin:20px 0 0 10px;}
.client-services ul li { padding:0 0 10px 30px;  display:block; no-repeat top left;}


.client-payment h1 { margin:0; padding:0; width:100%; text-align:center; font-family: 'Roboto-Condensed'; font-size:1.5em; color:#fff;}
.client-payment ul { margin:20px 0 0 0; padding:0; width:100%;}
.client-payment ul li { list-style:none; margin:0; padding:5px 12px 5px 12px; text-align:left; display:inline-block;  font-family: 'Roboto-Regular'; font-size:0.9em; color:#fff; }
.client-payment ul li:last-child { border:none;}
.client-payment ul { margin:20px 0 0 10px;}
.client-payment ul li { padding:0 0 10px 30px;  display:block;}

.bank-details {    list-style: none;
    margin: 0;
    padding: 5px 12px 5px 12px;
    text-align: left;
    display: inline-block;
    font-family: 'Roboto-Regular';
    font-size: 0.7em;
    color: #fff;}

.map { margin:0; padding:2%; float:left; background: #101010; width:96%; height:200px;}
.copyright { background:linear-gradient(#fd0000, #800001); margin:0; padding:10px 0; float:left; width:100%; text-align:center; font-family:'Roboto-Regular'; font-size:0.7em; color:#fff; font-style:italic;}
.copyright a { text-decoration:none; font-style: normal; color:#ffa926;}