/* apply drop shadow to mobile */
@media only screen and (max-width: 414px) {
	.home-shadow {
		text-shadow: 2px 2px 2px rgba(25,25,25,0.9);
	}
}

/* 
@media only screen and (min-width: 1023px) {
	.home .hero-carousel-section .carousel-slide {
		padding-top: 0px;
	}
} */

@media only screen and (max-width: 1025px) {
  .people .person img {
        -webkit-clip-path: none !important;
          clip-path: none !important; 
          border-radius: 10px !important;

      } 
}

.pcu-tde input.inline-radio-field:checked + label:before, .pcu-tde input.inline-checkbox-field:checked + label:before {
	content: '\e821' !important;
}

.interest, .comparison{

    float:left;
    padding:10px 15px !important;
    margin-bottom: 10px;

}

.interest{
    color:#fff !important;
    background-color: #0E6294;
    border-radius: 5px 0 0 5px;
}

.comparison{
    color:#fff !important;
    background-color: #338ABD;
    border-radius: 0 5px 5px 0;
}

.rate{
    font-weight: bold;
    font-size: 26px !important;
    letter-spacing: 3px;
}

.tick-dash {
	height: 30px;
}

.text-center i{
    color:#BFBFBF;
    font-size: 35px !important;
}


.header .menu li.desktop a {
        display: none !important; }
@media only screen and (min-width: 1441px) {
  .header .menu li.desktop .big {
    display: inline-block !important; } }
@media only screen and (max-width: 1440px) {
  .header .menu li.desktop .small {
    display: inline-block !important; } }

 @media only screen and (min-width: 1441px) {
          .header .menu li.desktop .big span {
            display: inline; } }

@media only screen and (min-width: 1023px) {
	.header.large-header .sub-header li {
   	 padding: 0 14px;
	}
}

@media only screen and (max-width: 1024px) {
    .header.large-header .sub-header {
            display:inherit;
    }
}

.footer .content .column {
	text-align: left;
}

.footer .content .tde {
	text-align: center;
}

.pcu-tde .button-group-inline .button {
    vertical-align: middle;
    width: 155px !important;
    height: 155px !important;
    padding: 4px !important;
    padding-top: 35px !important;
    margin-left: 5px;
    float:left !important;
}

.pcu-tde .pcu-app-form #application-type .button {
	height: 220px !important;
}

.pcu-tde .button.icon-large-button i {
    font-size: 48px !important;
}

@media only screen and (max-width: 641px) {
    .pcu-tde .button-group-inline .button {
        vertical-align: middle;
        width: 80px !important;
        height: 80px !important;
        padding: 4px !important;
        padding-top: 10px !important;
        margin-left: 5px;
        float:left !important;
    } 

    .pcu-tde .button.icon-large-button i {
        font-size: 28px !important;
    }
}

/* Make the lock navigation on the home page appear on ipad portrait mode */
@media  only screen and  (min-height: 600px)  {
	@media only screen and (min-width : 768px){
		.home #fp-nav {
	  			display: block !important;
	  		}
	}
}


@media only screen and (min-width: 1023px) {
          .header .menu li.desktop-only span{
            display: inline !important; 
        } 
}

@media only screen and (max-width: 1023px) {
          .header .menu li.desktop-only span.small {
            display: inline !important; 
        } 
}

@media  only screen and  (min-height: 600px)  {

     .main-content {
        _min-height:400px !important;
    }
        
}



/*===================== variable ===================== */
/* ============================================================ 
    1. Wide Screen
=============================================================*/

@media only screen and (max-width: 1023px) {

    .panel-content{
        margin-left: 25px;
    }


}

/* ============================================================ 
    2. Tablet Portrait
=============================================================*/
@media only screen and (max-width: 950px) and (min-width: 650px) {

	.search-hero > label > * {
    	display: block !important;
	}

.search-hero input[type="submit"] {
    display: none !important;
    margin-top: -15px;
	}

.panel-content{
        margin-left: 25px;
    }

label.atm, label.branch, label.search{
    position: absolute !important;
    left: 433px !important;
    margin-top: 63px !important;
}

}

/* ============================================================ 
    2. Tablet Landscape
=============================================================*/
@media only screen and (max-width: 650px) {

.search-hero > label > * {
    display: block !important;
}

.search-hero input[type="submit"] {
    display: none !important;
    margin-top: -15px;
    width: 250px !important;
}

.panel-content{
        margin-left: 5px;
    }

label.atm, label.branch, label.search{
    position: absolute !important;
    left: 433px !important;
    margin-top: 63px !important;
}
 
}

/* ============================================================ 
    3. Mobile Landscape
=============================================================*/
@media only screen and (max-width: 490px) and  (min-width: 360px) {

	.search-hero > label > * {
    	display: block !important;
	}

	.search-hero input[type="submit"] {
    	display: none !important;
    	margin-top: -15px;
    	width: 250px !important;
	}

    .panel-content{
        margin-left: 5px;
    }

    label.atm, label.branch, label.search{
        position: absolute !important;
        left: 223px !important;
        margin-top: 41px !important;
    }

    .search-hero > label > input {
        width: 200px !important;
        font-size: 1rem !important;
        border-radius: 0 !important;
        height: 40px !important;
        box-shadow: 0 2px #127ab9 !important;
    }

   
}


/* ============================================================ 
    3. Mobile portrait
=============================================================*/
@media only screen and (max-width: 360px) {

.search-hero > label > * {
    display: block !important;
}

.search-hero input[type="submit"] {
    display: none !important;
    margin-top: -15px;
    width: 250px !important;
}

.panel-content{
    margin-left: 5px;
}

.search-hero > label > input {
        width: 200px !important;
        font-size: 1rem !important;
        border-radius: 0 !important;
        height: 40px !important;
        box-shadow: 0 2px #127ab9 !important;
    }

label.atm, label.branch, label.search{
        position: absolute !important;
        left: 223px !important;
        margin-top: 41px !important;
    }

}