﻿@charset "utf-8";
/* Simple fluid media
   Note: Fluid media requires that you remove the media's height and width attributes from the HTML
   http://www.alistapart.com/articles/fluid-images/ 
*/
img, object, embed, video {
	max-width: 100%;
}

/* IE 6 does not support max-width so default to width 100% */

.ie6 img {
	width:100%;
}

.customwidthfourth{
		width: 50%;
	float: left;
	text-align: left;
    padding-bottom:5px;
}

.customwidthfifth{
		width: 50%;
	float: left;
	text-align: left;
    padding-bottom:5px;
}

/*
	Dreamweaver Fluid Grid Properties
	----------------------------------
	dw-num-cols-mobile:		5;
	dw-num-cols-tablet:		8;
	dw-num-cols-desktop:	12;
	dw-gutter-percentage:	25;
	
	Inspiration from "Responsive Web Design" by Ethan Marcotte 
	http://www.alistapart.com/articles/responsive-web-design
	
	and Golden Grid System by Joni Korpi
	http://goldengridsystem.com/
*/

.customwidthfourth{
		width: 50%;
	float: left;
	text-align: left;
}

/* Mobile Layout: 480px and below. */

#tooltip{
    text-align:center; 
    color: #000; 
    background: #fff; 
    position: absolute;
    cursor:pointer; 
    z-index: 99999; 
    padding: 15px; 
    font-size:12px;
    -webkit-box-shadow: 0px 0px 8px 0px rgba(50, 50, 50, 0.71);
    -moz-box-shadow:0px 0px 8px 0px rgba(50, 50, 50, 0.71);
    box-shadow:0px 0px 8px 0px rgba(50, 50, 50, 0.71); 
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#tooltip:after  {
    width: 0; 
    height: 0; 
    border-left: 10px solid transparent; 
    border-right: 10px solid transparent; 
    border-top: 12px solid #fff; 
    background:url(../images/img-tooltip.png) bottom no-repeat;  
    content: '';  
    position: absolute; 
    left: 50%;
    bottom: -10px; 
    margin-left: -10px; 
}

#tooltip.top:after { 
    border-top-color: transparent;  
    top: -20px; 
    bottom: auto;  
}

#tooltip.left:after  { 
    left: 10px; 
    margin: 0;  
}

#tooltip.right:after {
    right: 10px; 
    left: auto; 
    margin: 0;
}

.theme-bg{
	display:none;
	}

.theme-bg img{
	-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
	}	

.header-wrap {
	margin-left: auto;
	margin-right: auto;
	margin-top: 25px;
	margin-bottom: 5px;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
}

.header-wrap img{
-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}

.header-wrap a img, .header-wrap a img:hover{
    border:none}

#psbanklogo {
	clear: both;
	float: left;
	margin-left: 0;
	margin-bottom: 20px;
	width: 100%;
	display: block;
	text-align: center;
}

#date-time {
	clear: none;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
	text-align: center;
	font-size: 11px;
	padding-top: 8px;
	border-top:1px solid #dce8f2;
}

#searchbox {
	clear: none;
	float: right;
	width: 100%;
	display: block;
	margin-top: 10px;
	position:relative;
	height:24px;
	border:1px #CCCCCC solid;
}

#searchbox span{
	top:0;
	right:0;
	width:24px;
	height:24px;
	position:absolute;
	z-index:99;
}

#searchbox span img{
	
}

#searchbox input{
	border:0;
	height:24px;
	width:86%;
	padding: 0 12% 0 2%;
}

#mainnav{
	margin-left: auto;
	margin-right: auto;
	width: 92%;
}

.container-wrap {
	display: block;
	margin-left: auto;
	margin-right: auto;
	margin-top: 25px;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
	position:relative;
}

.psbankonline {
	clear: both;
	margin:0 auto -55px auto;
	width: 94%;
	padding:15px 0;
	text-align: center;
	background: #a7c5e0 url(../images/psbank-online_bg.jpg) top repeat-x;
	-webkit-border-radius: 20px;
    -moz-border-radius: 20px;
    border-radius: 20px;
    border: 3px solid #dce8f2;
    font-size:11px;
    line-height:2em;
    position:absolute;
	bottom:-435px;
}

.psbankonline span {
    color:rgb(41,86,160); 
    font-weight:bold;
}

.psbankonline a{
	text-decoration:none;
	color:rgb(229,38,35);
	font-weight: bold;
	
}

.psbankonline a:hover{
	color:rgb(41,86,160);
}

.psbankonline .btn{
	display:inline-block;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	padding: 4px 20px;
	background-color:rgb(229,38,35);
	color: #fff;
	font-weight: bold;
	line-height:15px;
	margin:4px 0;
}

.psbankonline .login{
	font-size: 13px;
	margin:8px 0;
}

.psbankonline :hover.btn {
	background-color:rgb(41,86,160);
	color: #fff;
}

.psbankonline img{
	display:block;
	padding: 10px 0;
	margin: 0 auto;
	-webkit-border-radius: 0;
-moz-border-radius: 0;
border-radius: 0;
}

.psbankonline ul{
	margin: 10px auto 0 auto;
	padding:0;
	list-style-type: none;
	border-bottom: 1px #dce8f3 solid;
	width: 182px;
}

.psbankonline ul li{	
	border-top: 1px #dce8f3 solid;
	padding: 5px 0;
}

.psbankonline ul li a{
	text-decoration:none;
	font-size:14px;
	font-weight:bold;
	line-height:1.65em;
}

.psbankonline img.divider{
    display:block
}

.otherservices{
	display: none;
}

.carousel {
	clear: both;
	margin: 0 auto;
	width: 100%;
}

.loading{
	height: 100%;
	background: #000 url(../images/loading.gif)center center no-repeat;
	}

.dtop-slide {
    display:none
}

.mobile-slide {
    display:block
}

.whatsnew-wrap{
	clear: both;
	margin: 0 auto;
	width: 90%;
	font-size: 12px;
	line-height: 1.5em;
	font-size: 11px;
	color: #999;
	padding: 5px 20px 5px 20px;
	border: 3px solid #dce8f2;
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px;
	border-radius: 20px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box; 
}

.footer-wrap2 {
	margin-left: auto;
	margin-right: auto;
	margin-top: 10px;
	margin-bottom: 15px;
	width: 87.36%;
	padding-left: 1.82%;
	padding-right: 1.82%;
}

.footer-wrap2 .footer-links ul{
	width: 100%;
	margin: 6px auto 0 auto;
	padding:0;
	list-style-type: none;
	border-top:1px solid #dce8f2;
}

.footer-wrap2 .footer-links ul li{
	text-align: center;
	padding: 10px 0;
	display:block;
	border-bottom:1px solid #dce8f2;
}

.footer-wrap2 .footer-links ul li a{
	color: #737373;
	text-decoration: none;
}

.footer-wrap2 .footer-links ul li a:hover{
	color:rgb(229,38,35);
	text-decoration: none;
}

.footer-wrap2 .social{
	clear: both;
	display:block;
	width: 100%;
	text-align:center;
}

.footer-wrap2 .social img{
	display: inline-block;
	margin: 10px 5px 0 0;
}

.footer-wrap2 .footer{
	clear: none;
	float: left;
	margin-left: 0;
	margin-top: 10px;
	margin-bottom: 10px;
	width: 100%;
	display: block;
	text-align: center;
	color: #737373;
	font-size: 10px;
}

.footer-wrap2 .footer img{
	margin-top: 5px;
}

.footer-wrap2 .footer .member{
	display:block;
	margin-bottom: 10px;
}

.footer-wrap2 .footer .copyright{
	display:block;	
}

.footer-wrap2 .footer .copyright br{
	display:block;
}

#popup2 {
	display:none; 
	position: fixed; 
	width:100%; 
	text-align:center;  
	top:0;
	left:0; 
	overflow: hidden; 
	z-index:9999999999;
height: 100%; background-color:#000;  
background:rgb(0,0,0);
    background: transparent\9;
	background:rgba(0,0,0, 0.6);
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#99000000,endColorstr=#99000000);
}

.message2{
	background:#fff; 
	position:relative; 
	top:10px; 
	left:50%;  
	width:300px; 
	margin-left: -150px; 
	-webkit-box-shadow: 0 0 18px 2px rgba(32,32,32,.5);
	-moz-box-shadow: 0 0 18px 2px rgba(32,32,32,.5);
	box-shadow: 0 0 18px 2px rgba(32,32,32,.5);
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px; 
	border-radius: 20px; 
	padding:10px 0 20px 0;
}

.message-box{
	background-color: #fff;
	width: 85%;
	margin:0 0 0 9%;
	padding: 20px 0;
	text-align: left;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px; 
	border-radius: 10px;
	height: 300px;
	}
	
.message-content{
	height: 300px;
	overflow-y: auto;
	}
	
.message-content p {
    padding-right: 10px 
}

.closebtn{
	display:inline-block;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	background-color:#fff;
	color: rgb(229,38,35) !important;
	font-weight: bold;
	line-height:15px;
	text-align: center;
	padding: 10px 20px;
	margin-top:15px;
	text-decoration: none;
}

.closebtn:hover{
	background-color:rgb(41,86,160);
	color: #fff !important;
	text-decoration:none !important;
}

.message2 .closebtn{
	display:inline-block;
	-webkit-border-radius: 9px;
	-moz-border-radius: 9px;
	border-radius: 9px;
	background-color:rgb(229,38,35);
	color: #fff !important;
	font-weight: bold;
	line-height:15px;
	text-align: center;
	padding: 10px 20px;
	margin-top:15px;
	text-decoration: none;
}

.message2 .closebtn:hover{
	background-color:rgb(41,86,160);
	color: #fff !important;
	text-decoration:none !important;
}

.message-content td.lefttd {
    border-bottom: 6px solid rgb(229,38,35); 
    padding-bottom:10px
}

.message-content td.url-img {
    text-align: center; 
    padding-top:10px
}

.message-content table, .message-content td, .message-content th {
    border-collapse:collapse;
}

.message-content td{ 
    float:left; 
    width:95%; 
    text-align:center
}

.message-content h1{
    color:rgb(229,38,35); 
    font-size:16px; 
    text-align:center
}

.message-content a{
    color:rgb(229,38,35); 
    text-decoration:none
}

.message-content a:hover{
    color:rgb(41,86,160); 
    text-decoration:none
}

/* Tablet Layout: 481px to 768px. Inherits styles from: Mobile Layout. */

@media only screen and (min-width: 360px) {
.footer-wrap2 .footer .copyright br{
	display:none;
}
}

@media only screen and (min-width: 481px) {
.header-wrap {
	width: 90.675%;
	padding-left: 1.1625%;
	padding-right: 1.1625%;
}
#psbanklogo {
	clear: none;
	float: left;
	margin-left: 0;
	width: 100%;
	display: block;
}
#date-time {
	
}

#mainnav{
	width: 95%;
}

.container-wrap {
	width: 90%;
	margin: 0 auto;
	padding-left: 0;
	padding-right: 0;
	
}

.psbankonline {
	clear: none;
	width: 99.25%;
}
.carousel {
	clear: none;
	display: block;
	margin:0;
}

.whatsnew-wrap{
	/*width: 89%;*/
	margin:10px auto 0;
}
/*.message2{ 
	left:50%;  
	width:400px; 
	margin-left: -200px;
}*/ 
.message2{
	background:#fff; 
	position:relative; 
	top:90px; 
	left:50%;  
	width:450px; 
	margin-left: -225px; 
	-webkit-box-shadow: 0 0 18px 2px rgba(32,32,32,.5);
	-moz-box-shadow: 0 0 18px 2px rgba(32,32,32,.5);
	box-shadow: 0 0 18px 2px rgba(32,32,32,.5);
	-webkit-border-radius: 20px;
	-moz-border-radius: 20px; 
	border-radius: 20px; 
	padding:10px 0 20px 0;
}

.message-box{
	height: 355px;
	width:420px;
	margin:0 auto;
	}
	
.message-content{
	height: 370px;
	}
.message-content td.lefttd {width:30%; border-right: 6px solid rgb(229,38,35); border-bottom:none}	
.message-content td.url-img {text-align: right; /*padding-top:0*/}

.message-content td{float:none; width:auto; padding:16px; text-align:left}
}

@media only screen and (min-width: 500px) {
 .psbankonline{
     bottom:-435px
 }
}

@media only screen and (min-width: 513px) {
	.footer-wrap2 .footer img{
	margin-top: 0;
}
}

@media only screen and (min-width: 769px) {
.theme-bg{
	width: 100%;
	padding-left: 0;
	padding-right: 0;
	max-width: 950px;
	position: relative;
	display:block;
	margin:0 auto;
	}	
	
.header-wrap {
	width: 92%;
	max-width: 950px;
	padding-left: 4%;
	padding-right: 4%;
	margin: auto;
	margin-top: 33px;
	position: absolute;
	z-index: 1;
	left: 0;
	right:0;
	top: 0;
}

#psbanklogo {
	clear: both;
	float: left;
	margin-left: 0;
	width: 32.2033%;
	display: block;
	text-align: left;
}

#date-time {
	clear: none;
	float: right;
	margin-left: 0;
	width: 40.6779%;
	display: block;
	text-align: right;
	border-top: none;
}

#searchbox {
	clear: none;
	float: right;
	width: 25%;
	display: block;
	margin-left: 15%;
	margin-top: 10px;
}

#searchbox span{
	width:24px;
	height:24px;
	position:absolute;
	z-index:99;
}

#searchbox span img{
	
}

#searchbox input{
	top:0;
	right:0;
	line-height: 1.75em;
	width: 86%;
	*width: 85%;
	position:absolute;
	z-index:9;
}

#mainnav {
	position:relative; 
	z-index: 11;
	width: 92%;
	max-width: 950px;
	padding-left: 4%;
	padding-right: 4%;
	margin: 10px auto 0 auto;
}

.container-wrap {
	width: 92%;
	max-width: 950px;
	padding-left: 4%;
	padding-right: 4%;
	margin-top: 10px;
	display: block;
}

.psbankonline {
	clear: none;
	float: left;
	margin-left: 0;
	width: 189px;
	display: block;
	padding:15px;
	margin-right: 10px;
	position:static;
}

/*.otherservices{
	display:block;
}*/

.carousel {
	clear: none;
	width: auto;
	display: block;
	overflow: hidden;
	margin:0;
}

.whatsnew-wrap {
	width: 92%;
	max-width: 950px;
	/*padding-left: 0;
	padding-right: 0;*/
	margin: 10px auto;
	display:table;

}

.no-margin{margin: 0;}

.footer-wrap2 {
	width: 92%;
	max-width: 950px;
	/*padding-left: 4%;
	padding-right: 4%;*/
	padding-left: 0;
	padding-right: 0;
	margin-top: 10px;
	margin-bottom: 25px;
	font-size: 10px;
	border-top:1px solid #dce8f2;
}

.footer-wrap2 .footer-links{
	clear: none;
	float: left;
	margin-left: 0;
	width: 50%;
	display: block;
	height:80px;
}

.footer-wrap2 .footer-links ul{
	margin: 6px auto 0 auto;
	padding:0;
	list-style-type: none;
	border: none;
}

.footer-wrap2 .footer-links ul li{
	display:block;
	float:left;
	padding:0;
	border: none;
}

.footer-wrap2 .footer-links li+li:before{
	content:"|";
	margin: 0 3px;
}

.footer-wrap2 .footer-links ul li a{
	color: #737373;
	text-decoration: none;
}

.footer-wrap2 .footer-links ul li a:hover{
	color:rgb(229,38,35);
	text-decoration: underline;
}

.footer-wrap2 .social{
	clear: both;
	display:block;
	text-align: left;
}

.footer-wrap2 .social img{
	display: inline-block;
	margin: 10px 5px 0 0;
}

.footer-wrap2 .footer{
	clear: none;
	float: left;
	margin-left: 0;
	margin-top:5px;
	width: 50%;
	display: block;
	text-align: right;
	height:80px;
	color: #737373;
}

.footer-wrap2 .footer img{
	margin-top: 5px;
}

.message2{
	width:600px; 
	margin-left: -300px; 
}

.message-box{
	height: 340px;
	width:550px;
	margin:0 auto;
	}
	
.message-content{
	height: 350px;
	}

.message-content td.lefttd {width:30%; border-right: 6px solid rgb(229,38,35); border-bottom:none}	
}

@media only screen and (min-width: 900px) {
	.dtop-slide{display:block}
.mobile-slide{display:none}
}

@media only screen and (min-width: 949px) {
.footer-wrap2 .footer{margin-top: 0;
}

}

@media only screen and (min-width: 950px) {
.theme-bg{
	width: 100%;
	padding-left: 0;
	padding-right: 0;
	max-width: 950px;
	position: relative;
	display:block;
	margin:0 auto;
	}		
	
	.header-wrap {
		display:block;
	width: 100%;
	max-width: 950px;
	padding-left: 0;
	padding-right: 0;
	margin: auto;
	margin-top: 25px;
	position: absolute;
	z-index: 1;
	left: 0;
	right:0;
	top: 0;
}

#mainnav{
	position:relative; 
	z-index: 11;
	width: 100%;
	max-width: 950px;
	padding-left: 0;
	padding-right: 0;
	margin: 0 auto;
}

.dtop-slide{display:block}
.mobile-slide{display:none}

.container-wrap {
	width: 100%;
	max-width: 950px;
	padding-left: 0;
	padding-right: 0;
	margin-top: 10px;
}
.psbankonline {
	margin-bottom:0;
}
.psbankonline .btn{display:none}
.psbankonline .login{display:inline-block;}
.psbankonline img.divider{display:none}

.loading{
	height: 100%;
	background: #000 url(../images/loading.gif)center center no-repeat;
	}

.otherservices{
	display: block;
}

.whatsnew-wrap {
	display: block;
	width: 100%;
	max-width: 950px;
}


.footer-wrap2 {
	width: 100%;
	max-width: 950px;
	padding-left: 0;
	padding-right: 0;
	padding-top:10px;
	margin: 10px auto 10px auto;
	border-top:2px dotted #dce8f2;
}

.footer-wrap2 .footer img {
	margin-top:0;
}
}

@media only screen and (max-width:540px) {
.customwidthfourth{
		width: 100%;

}
.customwidthfifth{
		width: 100%;

}
}

@media only screen and (min-width:769px) {
.customwidthfourth{
		width: 50%;

}
.customwidthfifth{
		width: 50%;

}
.container-wrap{
    min-height: 500px;
}
}

@media only screen and (min-width:949px) {
.customwidthfourth{
		width: 25%;

}
.customwidthfifth{
		width: 50%;

}
.container-wrap{
    min-height: unset;
}
}

 @font-face {
            font-family: 'Glyphicons Halflings';
            src: url(../fonts/glyphicons-halflings-regular.eot);
            src: url(../fonts/glyphicons-halflings-regular.eot?#iefix) format('embedded-opentype'), url(../fonts/glyphicons-halflings-regular.woff) format('woff'), url(../fonts/glyphicons-halflings-regular.ttf) format('truetype'), url(../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular) format('svg');
        }