@charset "utf-8";
/*/id%6D61726D616E6179
  ------------------------
  RESPONSIVE CSS   
  @MEDIA QUERIES 
  ------------------------  
*/


/* Content Changes */
#res_menu {}
#res_select, .navigate, 
.midafter, .mob-only {display:none;}




/* Tablet Portrait (fixed width) */
@media only screen and (min-width: 768px) and (max-width: 1000px) {
	
	img, .img-res {max-width:100%; height:auto;}
	table .img-res {width:100%;}
	
	#container-holder {width: auto; padding: 0; margin: 0;}
	#container {width:738px; margin: 0 auto;}
.header_CTA {display:none;}
	#video_wrapper {display: none;}
    .holder1.mobile {display:block!important;}
    .holder1 {width:100%!important;}
    .holder2, .vidframe, .right-border {display:none;}

	.home_logo {padding: 30px 0; text-align: left; float: none;}
    .twenty-years {top:0px;}

	#navigation {display: none;}
	#menu {background: #9dcf31; height: 40px;  clear: both;   float: none; padding: 0;}
	#menu, #menu ul {width: auto;}
	#menu ul {display:none;}
     #flash2 {display:none;}
    #flash3 {display:block; margin-top:20px;left:25%;}
	
	#res_menu {background:url(../images/bg-navigate.png) no-repeat right center rgba(21, 62, 120, 1); height:40px; position:relative; padding:0; text-align:left;}
	#res_menu .navigate {display:block; position:absolute; color:#fff; font:bold 14px Arial, Helvetica, sans-serif; text-transform:uppercase;font-weight:600; line-height:40px; left:10px;}
	#res_select {display:block; opacity:0; width:100%; height:100%; position: relative; z-index: 100;}
	#res_select option[value="undefined"] {display: none;}

	.header_photo {float: none; margin-top: -25px; margin-bottom: -27px; text-align: center;}

	.main-holder {position: static;}
	.main {background: #fff;}
	.homebox {background-position: right top;}
    .btnbox {padding: 12px 15px 22px;}
    .btnbox, .btnboxCompany, .btnboxBenefits, .btnboxProcess {width:40%;}
	.column {float: none; width: auto; padding-bottom:0;}
	.content {width: auto; float: none; padding: 15px 20px 0;}
    
    .mobile-footer-uklogo {display:block!important;}
    .ukpensionslogo {padding: 5px 0px 10px 90px;	margin: -62px 0 0px 0px;}
    
    
.mobile div.phoneNumbers {
    text-align: left;
    margin: 0 0 10px;
    clear: both;
    color: #f00000;
    font-size: 22px;
}
   
}



/* All Mobile Sizes and Small Tablet (devices and browser) */
@media only screen and (max-width: 767px) {
	
	img, .img-res {max-width:100%; height:auto;}
	img.left, img.right {float:none; margin:0 0 15px !important;}
	
    .header_CTA {display:none;}
	#container-holder {width: auto; padding: 0; margin: 0;}
	#container {width:auto; margin: 0 20px;}

	#video_wrapper {display: none;}
    .holder1.mobile {display:block!important;}
    .holder1 {width:100%!important;}
    .holder2, .vidframe, .right-border {display:none;}

	.home_logo {padding: 30px 0; text-align: left; float: none;}
    .twenty-years {top:0px;}
    
	#navigation {display: none;}
	#menu {background: #9dcf31; height: 40px;  clear: both;   float: none; padding: 0;}
	#menu, #menu ul {width: auto;}
	#menu ul {display:none;}
    #flash2 {display:none;}
    #flash3 {display:block; margin-top:0px; left:20%}
	#res_menu {background:url(../images/bg-navigate.png) no-repeat right center rgba(21, 62, 120, 1); height:40px; position:relative; padding:0; text-align:left;}
	#res_menu .navigate {display:block; position:absolute; color:#fff; font:bold 14px Arial, Helvetica, sans-serif; text-transform:uppercase; line-height:40px; left:10px;}
	#res_select {display:block; opacity:0; width:100%; height:100%; min-height:50px; position: relative; z-index: 100;}
	#res_select option[value="undefined"] {display: none;}
    #res_select option {line-height:50px;}

      
.mobile div.phoneNumbers {
    text-align: left;
    margin: 0 0 10px;
    clear: both;
    color: #f00000;
    font-size: 20px;
}
   
        
	.header_photo {float: none; margin-top: -25px; margin-bottom: -27px; text-align: center;}

	.main-holder {position: static;}
	.main {background: #fff;}
	.homebox {background-position: right top;}
    .btnbox {padding: 12px 15px 22px;}
    .btnbox, .btnboxCompany, .btnboxBenefits, .btnboxProcess {width:94%;}
	.column {float: none; width: auto; padding-bottom:0;}
	.content {width: auto; float: none; padding: 15px 20px 0;}
	.content p {padding-right: 0;}

	.holder .box {display: inline-block; padding: 0 5px; margin: 0; width: auto;}
	.holder .box p {padding: 0;}

	div.list {width: auto;}

	#lightbox {}
	#outerImageContainer {max-width:90%; min-width:90%; height:auto !important; font-size:15px !important;}
	#imageDataContainer {max-width:90%; min-width:90%; position:relative;}	
	#hoverNav a {height:100% !important;}
   	.mobile-footer-uklogo {display:block!important;}
    .ukpensionslogo {padding: 5px 0px 10px 90px;margin: -42px 0 0px 0px;}
    
    /*.homemaindriver {position:relative;} 
    .btnbox.posfree {position:absolute; margin:25px 0 0;}  
    .phoneNumbers.poscall {margin-bottom:105px;}*/
    
    .mob-only {display:block;}
    .pc-only {display:none;}
    
}


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

    
.mobile div.phoneNumbers {
    text-align: left;
    margin: 0 0 10px;
    clear: both;
    color: #f00000;
    font-size: 18px;
}
    

}


/* Mobile Portrait Size  */
@media only screen and (max-width: 480px) {
	#container {margin: 0 10px;}
    
    .home_logo {padding: 30px 0; text-align: left; float: none;}
    .twenty-years {top:0px;}

	.header_photo {margin: -19px auto; max-width: 300px;}
	.header_photo > img {margin: 0 0 0 -40px;}

.mobile div.phoneNumbers {
    text-align: left;
    margin: 0 0 10px;
    clear: both;
    color: #f00000;
    font-size: 13px;
}
	.homemaindriver {float: none;}
	div.phoneNumbers {text-align: left; margin: 0 0 10px; clear: both; }
.mobile div.phoneNumbers {
    text-align: left;
    margin: 0 0 10px;
    clear: both;
    color: #f00000;
    font-size: 13px;
}
	div.transfer-list {width: auto; float: none;}
	div.list {width: auto; float: none;}
	div.alphabet {float: none;}
    #flash3 {display:block; margin-top:0px; left:3%}
    .ukpensionslogo {
  padding: 5px 0px 10px 90px;
  margin: -42px 0 0px 0px;
}
    
    
}

@media only screen and (max-width: 460px) {
    .btnbox.posfree {margin:40px 0 0;}  
    .home_logo {padding: 30px 0; text-align: left; float: none;}
    .twenty-years {top:0px;}
}

@media only screen and (max-width: 360px) {
	#recaptcha_widget_div {height: 128px; position: relative;}
	#recaptcha_area {left: 50%; margin: 0 0 0 -158px; position: absolute; width: 318px !important;}
    #flash3 {display:none; margin-top:0px; left:10%}
    .btnbox, .btnboxCompany, .btnboxBenefits, .btnboxProcess {width:85%;}
    .home_logo {padding: 30px 0; width:70%; text-align: left; float: none;}
    .twenty-years {top:20px; margin-right:-60px; background: url(/images/BRITANNIA-20yr-Seal-sml.png) no-repeat;}

    
   .inputs {
  width: 90%;
  float: left;
  overflow: hidden;
}

.form-holder input, .form-holder select {
  width: 90%;
  float: left;
  padding: 3px 3px 3px 10px;
    }

.form-holder .big input {
  width: 90%;
  padding: 3px 3px 3px 10px;
}
.form-holder .ltl input, .form-holder .ltl select{width:90%;!important;}
.form-holder .ltl label{padding-left:10px;}

.form-holder .inputs label{float:left; margin-top: 5px;}
.form-holder .area{
	width:90%;
	padding-left:10px;
	float:left;
}

.form-holder .area label{float:left;}
.form-holder .area textarea{
	width:90%;
} 
    
    
    
}



