/* ===== CSS for Offices pages - branch detailed view and branch index page ============ */
	
	/* Detailed view page */
.innerContent{width:99%;text-align:left;}
.brInfo{/*float:left;*/	margin: 15px 0 0 25px;}
.brPicture{display:block;float:left;margin: 0 25px 10px 0;}
span.brTitle{display:block;font-size: 20px;color: #2879c8;}
ul.brContact{line-height:25px;padding:15px 0 0 0!important;list-style-type:none!important;}
ul.brContact li{list-style-type:none!important;}
	
#branchUsers{margin-top:20px;/*background-image:url('../images/branch-userlist-shade.png');background-repeat: repeat-x;*/}	
#branchUsers #titleBlock{padding: 10px 0 20px 1%;color:#000;}
#branchUsers .branchTitle{font-size:22px;color:#000;font-weight:bold;display:block;line-height: 1.5em;}
#branchUsers.title{font-size:14px;color:#000;display:block;line-height: 1.5em;}
#branchUsers .userList{padding: 0 0 10px 0px;}
#branchUsers img {margin:0;padding:0;}
#branchUsers .userBox{height:278px;width:31%;display:inline-block;vertical-align:top;overflow:hidden;text-align:center;padding:10px;border: 1px solid #ddd;border-radius: 5px;background: #fafafa;margin: 5px 1% 5px 0;}
#branchUsers .userBox:hover{border-color:#aaa;background: #eee;}
#branchUsers .imageBox a{display:inline-block;height: 180px;width:100%;line-height:180px;text-decoration:none;}
#branchUsers .imageBox{height:190px;width:100%;}	
#branchUsers .imageBox img{border:1px solid #ccc;padding:15px 5px;border-radius:5px;box-shadow:0px 0px 8px 0px rgba(165, 165, 165, 0.5);max-width:100%;width:108px;
max-height: 170px;height:auto;vertical-align:bottom;background:#fff;}
#branchUsers .userDetails{}
.userDetails.name a{font-size:15px;line-height:1.2em;}	
.userDetails.title {max-height:21px;overflow:hidden;}
.userDetails.title span {font-size:14px;color:#333;line-height:1.3em;}
.cnt #home {background:url("../images/general_home.gif") no-repeat scroll 20px 6px transparent;}
.cnt #phone {background:url("../images/general_phone.gif") no-repeat scroll 20px 6px transparent;}	
.cnt #mobile {background:url("../images/general_mobile.gif") no-repeat scroll 20px 6px transparent;}
.cnt #fax {background:url("../images/general_fax.gif") no-repeat scroll 20px 6px transparent;}
.cnt #mail {background:url("../images/general_mail.gif") no-repeat scroll 20px 6px transparent;}
.cnt p.wb {color:#343539;font-weight:bold;line-height:24px;padding:0 0 0 41px!important;}
.cnt p.wb3 {font-weight:normal;line-height:24px;padding: 10px 0 5px 41px;}
ul.brContact  {list-style-type: none;float:left;}	
	
	/* Branch Index page --------------------------------------*/
#branches{margin-top:20px;padding-bottom:30px;}
#branches #titleBlock{padding: 10px 0 20px 1%;}
#branches #title{font-size:22px;color:#000;font-weight:bold;display:block;line-height: 1.5em;}
#branches #titleComment{font-size:14px;color:#000;display:block;line-height: 1.5em;}
#branches .branchList{width:98%;margin-left:1%;}
#brTable{border-collapse:collapse;font-family:"Arial",Georgia,Serif;}
#brTable th {line-height:1.5em;color:#000;font-size:17px;border: 1px solid #d6d6d6;padding: 5px 15px;font-weight:normal;
/* background-image:url('../images/branch-userlist-shade.png'); */
background: #d6d6d6;
background: -moz-linear-gradient(top,  #d6d6d6 0%, #dbdbdb 2%, #ffffff 3%, #ffffff 4%, #e0e0e0 4%, #e0e0e0 4%, #e2e2e2 10%, #f4f4f4 41%, #ffffff 76%, #ffffff 99%, #fefefe 100%, #d8d8d8 100%);
background: -webkit-linear-gradient(top,  #d6d6d6 0%,#dbdbdb 2%,#ffffff 3%,#ffffff 4%,#e0e0e0 4%,#e0e0e0 4%,#e2e2e2 10%,#f4f4f4 41%,#ffffff 76%,#ffffff 99%,#fefefe 100%,#d8d8d8 100%);
background: linear-gradient(to bottom,  #d6d6d6 0%,#dbdbdb 2%,#ffffff 3%,#ffffff 4%,#e0e0e0 4%,#e0e0e0 4%,#e2e2e2 10%,#f4f4f4 41%,#ffffff 76%,#ffffff 99%,#fefefe 100%,#d8d8d8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d6d6d6', endColorstr='#d8d8d8',GradientType=0 );
	} 	
#brTable tr.odd td {}	
#brTable tr.even td {background-color:#f4f4f4;}
#brTable td {min-height:30px;padding:10px 10px 10px 10px;border: 1px solid #d6d6d6;color: #505050;font-size:12px;vertical-align: middle;}	
#brTable tr td:last-child {text-align:center;}
#brTable td .branchCity{}	
#brTable td .branchAddress{display:block;}
#brTable a.branchName{color: #555555;font-weight: bold;text-decoration:none;}
a.brButton {color: #fff!important;text-decoration: none;padding: 5px 15px 5px 15px;border: 1px solid #cc8351;border-radius:4px;font-size: 14px;
text-shadow: 0px 0px 5px #9e5709;
background: #ffa544;
background: -moz-linear-gradient(top,  #ffa544 0%, #ff8600 52%, #ff8600 52%, #ea7927 53%, #ed6600 100%);
background: -webkit-linear-gradient(top,  #ffa544 0%,#ff8600 52%,#ff8600 52%,#ea7927 53%,#ed6600 100%);
background: linear-gradient(to bottom,  #ffa544 0%,#ff8600 52%,#ff8600 52%,#ea7927 53%,#ed6600 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffa544', endColorstr='#ed6600',GradientType=0 );
	}
a.brButton:hover, a.brButton:active {
background: #ed6600;
background: -moz-linear-gradient(top,  #ed6600 0%, #ea7927 47%, #ff8600 48%, #ff8600 48%, #ffa544 100%);
background: -webkit-linear-gradient(top,  #ed6600 0%,#ea7927 47%,#ff8600 48%,#ff8600 48%,#ffa544 100%);
background: linear-gradient(to bottom,  #ed6600 0%,#ea7927 47%,#ff8600 48%,#ff8600 48%,#ffa544 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ed6600', endColorstr='#ffa544',GradientType=0 );
	}
/*===== End Office pages CSS =======================================*/
	
@media(max-width: 667px){
#brTable{text-align:center;}
#brTable th {padding: 15px 5px;text-align:center;} 
#brTable td {padding: 15px 5px;} 	
#brTable td .branchCity{display:inline;float:none;}	
#brTable td .branchAddress{float:none;}
	}
@media(max-width: 599px){
.branchPage, .branches{text-align:center;}
.innerContent .brPicture {max-width:99%;margin:5px auto;display:block;float:none;}
.brInfo{max-width:99%;font-size:17px;}
span.brTitle{font-size:30px;color:#2879c8;line-height: 1.3em;padding:0px 0 10px 0;}
.cnt #home, .cnt #phone, .cnt #mobile, .cnt #fax, .cnt #mail {/*background:none;*/}
.cnt p.wb {font-size:24px;padding:2px 5px 8px 5px;}
	}
@media(max-width:468px) {
#branchUsers .userBox {width:48%;}
	} 	
@media(max-width: 424px){
#titleBlock {text-align:center;}
	}	
@media(max-width: 320px){
#branchUsers .userBox {width:99%;height:auto;max-height:300px;}
#branchUsers .userDetails.name {max-height:55px;}
#branchUsers .userDetails.name a {font-size:24px;}
#branchUsers .userDetails.title {max-height:35px;}
#branchUsers .userDetails.title span {font-size:16px;}
#brTable th {padding: 10px 2px;} 
#brTable td {padding: 5px 2px;} 	}