.banner {border-top:1px solid #dfdfdf; width:100%; max-width:1030px; margin:0 auto; background-image:url(../images/common/grey-dot.jpg), url(../images/common/grey-dot.jpg), url(../images/bod/blue-line.jpg); background-repeat:repeat-y, repeat-y, repeat-x; background-position:0 0, right 0, 0 bottom; padding-bottom:4px; position:relative; }
/*.bannerCaption { width:100%; height:0; background-color:#dbe4e7; padding-bottom:50.3906%; position:relative;}*/
.bannerCaption { width:100%; height:0; background-color:#dbe4e7; padding-bottom:25.3906%; position:relative;}

/*.bannerDetail { width:450px; position:absolute; right:35px; top:7em; }*/
.bannerDetail { width:450px; position:absolute; right:35px; top:2.5em; }
.bannerDetail > h1 { font-family:'ProximaNova-Bold', 'ITFDevanagari-Bold', sans-serif; font-size:1.2em; line-height:1.2em; letter-spacing:.15em; color:#3a8cae; margin-bottom:1em; text-transform:uppercase; }
.bannerDetail > h1 > a { text-decoration:none; }
.bannerDetail > h2 { font-size:1.1em; line-height:1.2em; color:#666666; margin-bottom:1em; }
.bannerDetail > p { width:85%; font-size:.85em; line-height:1.4em; color:#808080; letter-spacing:.05em; background-image:url(../images/bod/blue-list-line.jpg); background-image:none; background-position:0 bottom; background-repeat:no-repeat; background-size:15px 2px; padding-bottom:2em; margin-bottom:2em; }
.bannerDetail > a { font-size:.75em; line-height:1.4em; color:#3a8cae; letter-spacing:.15em; text-transform:uppercase; text-decoration:none; }
.bannerDetail > a:hover {  color:#808080; }

.bannerImage { width:44.7572%; position:absolute; left:1px; top:0px; background-color:#fff; text-align:center; height:100%; border-bottom:1px solid #dfdfdf; }
.bannerImage img { height:100%; vertical-align:top; }


@media only screen and (max-width:920px){
	
	.banner { max-width:100%; margin:0 auto; background-image:url(../images/bod/blue-line.jpg); background-repeat:repeat-x; background-position:0 bottom; padding-bottom:4px; }
	.bannerCaption { height:auto; padding-bottom:0; padding-top:1em; }
	
	.bannerImage { width:100%; height:0; padding-bottom:70%; position:static; text-align:center; }
	.bannerImage img { width:53.75%; height:auto; vertical-align:bottom; }
	
	.bannerDetail { width:92%; margin:0 4%; padding:2em 0 2em 0; position:static; background-image:url(../images/bod/blue-line.jpg); background-repeat:repeat-x; background-size:auto 2px; background-position:0 0; }
	
	.bannerDetail > h1 { font-size:1.1em; margin-bottom:.5em; }
	.bannerDetail > h2 { font-size:1em; margin-bottom:.5em; }
	.bannerDetail > p { width:100%; font-size:.85em; background-size:15px 2px; padding-bottom:2em; margin-bottom:2em; }
	.bannerDetail > a { font-size:.75em; }
	
}
@media only screen and (max-width:480px){
	
	.bannerDetail > h1 { font-size:1em; margin-bottom:.5em; }
	.bannerDetail > h2 { font-size:.9em; margin-bottom:.5em; }
	.bannerDetail > p { width:100%; font-size:.8em; background-size:15px 2px; padding-bottom:2em; margin-bottom:2em; }
	.bannerDetail > a { font-size:.75em; }
	
}
/*-------------------*/

.content { width:100%; max-width:1030px; margin:0 auto; background-image:url(../images/bod/blue-line.jpg); background-repeat:repeat-x; background-position:0 bottom; padding-bottom:4px; }
.innerContent { width:100%; max-width:100%; background-image:url(../images/common/grey-dot.jpg), url(../images/common/grey-dot.jpg); background-repeat:repeat-y; background-position:0 0, right 0; }
.innerContent > h2 { font-size:1.9em; line-height:1.2em; padding:1em 35px; background-image:url(../images/common/grey-dot.jpg); background-repeat:repeat-x; background-position:0 bottom; margin-bottom:1px; color:#3a8cae; }

ul.userList { width:100%; overflow:hidden; border-left:1px solid #dfdfdf;}
.userList li { width:33.2333%; float:left; position:relative; display:block; background-image:url(../images/common/grey-dot.jpg), url(../images/common/grey-dot.jpg); background-repeat:repeat-x, repeat-y; background-position:0 bottom, right 0; background-color:#ffffff; min-height:356px;}
.userList li:nth-child(3),.userList li:nth-child(6),.userList li:nth-child(9) { background-image:url(../images/common/grey-dot.jpg); background-repeat:repeat-x; background-position:0 bottom; }

.userImage { padding:25px 75px 0 75px; min-height:172px; vertical-align:bottom;}
.userImage img { width:100%; height:auto; vertical-align:top; background-color:#fff; }

.userDetail { padding:20px 25px 0 25px; background-image:none; /*background-image:url(../images/bod/blue-list-line.jpg);*/ background-position:center bottom; background-repeat:no-repeat; background-size:23px 3px; text-align:center; background-color:#dbe4e7; border-right:1px solid #dfdfdf;}
.userDetail > h3 { font-family:'ProximaNova-Bold', 'Karma', serif; font-size:.9em; line-height:1.2em; letter-spacing:.15em; color:#3a8cae; margin-bottom:.5em; text-transform:uppercase; }
.userDetail > h3.hindi { font-weight:700; }
.userDetail > h3 > a { text-decoration:none; }
.userDetail > h4 { font-size:.95em; line-height:1.2em; color:#666666; margin-bottom:.5em; }
.userDetail > p { font-size:.9em; line-height:1.4em; color:#808080; }

.userLink { padding:0 5px 5px 5px; text-align:center; background-color:#dbe4e7; border-right:1px solid #dfdfdf;}
.userLink > a { font-size:.9em; line-height:1.4em; color:#3a8cae; letter-spacing:.15em; text-transform:uppercase; text-decoration:none; }
.userLink > a:hover {  color:#808080; }

@media only screen and (max-width:800px){
	
	.content { max-width:100%; }
	.innerContent { background-image:none; }
	.innerContent > h2 { font-size:1.7em; padding:1em 4%; }
	
	.userList li { width:50%; }
	.userList li:nth-child(3),.userList li:nth-child(6),.userList li:nth-child(9) {  background-image:url(../images/common/grey-dot.jpg), url(../images/common/grey-dot.jpg); background-repeat:repeat-x, repeat-y; background-position:0 bottom, right 0; }
	.userList li:nth-child(2),.userList li:nth-child(4),.userList li:nth-child(6),.userList li:nth-child(8) { background-image:url(../images/common/grey-dot.jpg); background-repeat:repeat-x; background-position:0 bottom; }
	
	.userImage { padding:2em 20% 0 20%; }
	
	.userDetail { padding:20px 10% 1em 10%; margin-bottom:0; }
	.userDetail > h3 { font-size:.9em; margin-bottom:.5em; }
	.userDetail > h4 { font-size:.95em; margin-bottom:.5em; }
	.userDetail > p { font-size:.9em; }
	
	.userLink { padding:0 10% 2em 10%; }
	.userLink > a { font-size:.8em; }
}

@media only screen and (max-width:480px){
	
	.content { width:92%; margin:0 4%; }
	.content:last-child { background-image:none; padding-bottom:0; }
	.innerContent > h2 { font-size:1.4em; background-image:none; }
	
	.userList li { width:100%;}
	.userList li:nth-child(n+0) {  background-image:url(../images/common/grey-dot.jpg); background-repeat:repeat-x; background-position:0 bottom; }
	
	/*.userImage { padding:2em 10% 2em 10%; }*/
	ul.userList {border-left:0;}
	.userDetail { padding:20px 10% 1em 10%; margin-bottom:0; }
	.userDetail > h3 { font-size:.9em; margin-bottom:.5em; }
	.userDetail > h4 { font-size:.95em; margin-bottom:.5em; }
	.userDetail > p { font-size:.9em; }
	
	.userLink { padding:0 10% 2em 10%; }
	.userLink > a { font-size:.8em; }
}

/*---------------------------*/

.detailOverlay { position:fixed; width:100%; height:100%; left:0; top:0; background-image:url(../images/common/overlay-bg.png); background-repeat:repeat; background-position:0 0; display:none; }

.innerLayer { width:100%; max-width:1020px; position:absolute; left:50%; top:10%; margin-left:-510px; background-color:#3a8cae; }

.innerDetail { display:none; }

.innerDetail > h2 { padding:1.5em 35px; font-size:1.2em; line-height:1.2em; color:#dadada; text-transform:uppercase; letter-spacing:.15em; }

.detailUser { margin:8px; padding:27px 27px 0 27px; background-color:#fff; overflow:hidden; }
.detailImage { width:30%; float:left; }
.detailImage img { width:100%; height:auto; vertical-align:top; background-color:#cdcbc4; }

.userDisc { width:66%; float:right; }
.userDisc > h3 { font-family:'ProximaNova-Bold', 'Karma', serif; font-size:1.2em; line-height:1em; letter-spacing:.15em; color:#3a8cae; margin-bottom:.3em; text-transform:uppercase; }
.userDisc > h3.hindi { font-weight:700; }
.userDisc > h4 { font-size:1.25em; line-height:1.2em; color:#666666; }
.userDisc > p { font-size:1.1em; line-height:1.2em; color:#808080; letter-spacing:.05em; }

.detailPara { width:100%; height:250px; margin:1em 0 2em 0; overflow:hidden; }
.scrollbar-content > p, .detailPara > p  { font-family:'ProximaNova-Regular','Karma', serif; font-size:.9em; line-height:1.5em; color:#808080; margin-bottom:1.2em; text-align:justify;}
.scrollbar-content > p:last-child { margin-bottom:0; }

.closeButton { position:absolute; right:35px; top:35px; }
.closeButton > a { width:24px; height:24px; display:block;  }

@media only screen and (max-width:1020px) {
	.innerLayer { width:100%; max-width:100%; top:10%; margin-left:-50%; }
}


@media only screen and (max-width:800px) {
	.detailOverlay { overflow-x:auto; }	
	.innerLayer { top:90px; }
	
	.innerDetail > h2 { padding:1.5em 4%; font-size:1.2em; }
	
	.detailUser { margin:1%; padding:3% 3% 0 3%; }
	
	.userDisc > h3 { font-size:1.1em; line-height:1em; margin-bottom:.3em; }
	.userDisc > h4 { font-size:1.15em; }
	.userDisc > p { font-size:1em; }
	
	.detailPara { height:auto; margin:1em 0 2em 0; }
	.scrollbar-content > p, .detailPara > p { font-size:.9em; margin-bottom:1.2em; }
}

@media only screen and (max-width:540px) {
	.detailOverlay { overflow-x:auto; }	
	.innerLayer { top:90px; }
	
	.innerDetail { text-align:center; padding-top:2em; }
	.innerDetail > h2 { padding:1.5em 4%; font-size:1.2em; }
	
	.detailUser { margin:1%; padding:3% 3% 0 3%; }
	
	.detailImage { width:100%; float:none; text-align:center; }
	.detailImage img { width:50%; background-color:#fff; }
	
	.userDisc { width:100%; float:none; text-align:center; margin-top:1.5em; }
	
	.detailPara { width:90%; height:auto; margin:1em auto 2em auto; text-align:justify; }
	.scrollbar-content > p, .detailPara > p  { font-size:.9em; margin-bottom:1.2em; }
	
	.closeButton { right:1em; top:1em; }
}

@media only screen and (max-width:480px) {
	.innerLayer { top:80px; }
	.innerDetail > h2 { font-size:1.1em; }
	.userDisc > h3 { font-size:.9em; line-height:1em; margin-bottom:.3em; }
	.userDisc > h4 { font-size:.9em; }
	.userDisc > p { font-size:.9em; }
}
@media only screen and (max-width:320px) {
	.innerLayer { top:65px; }
}
/*---------------------------*/

.scrollbar-path-vertical, .scrollbar-path-horizontal { position:absolute; background-color:#bebebe; background-color:rgba(190,190,190,0.8); z-index:100; }
.scrollbar-path-horizontal { bottom:5px; left:0; width:100%; height:10px; }
.scrollbar-path-vertical { right:0;  top:0;  height:100%;  width:8px;  }
.scrollbar-path-vertical { box-shadow:inset 1px 0px 1 rgba(0,0,0,0.1); -moz-box-shadow:inset 1px 0px 1 rgba(0,0,0,0.1); -webkit-box-shadow:inset 1px 0px 0 rgba(0,0,0,0.1); }
.scrollbar-path-horizontal { box-shadow:inset 0px 1px 1 rgba(0,0,0,0.1); -moz-box-shadow:inset 0px 1px 1 rgba(0,0,0,0.1); -webkit-box-shadow:inset 0px 1px 0 rgba(0,0,0,0.1); }
.scrollbar-handle{ position:relative; top:0; left:0; background-color:#3a8cae;  }
.scrollbar-path-vertical .scrollbar-handle { height:20%; width:100%; }
.scrollbar-path-horizontal .scrollbar-handle { width:20%; height:100%; }
.scrollbar-path-vertical, .scrollbar-path-horizontal, .scrollbar-handle { }
.scrollbar-content { padding:0 20px 0 0; }
@media only screen and (max-width:540px) {
	.scrollbar-content { padding:0; }
}