﻿@charset "UTF-8";
/* CSS Document */

/*@import url("meradio/meradio.css");*/


body {
	position: relative;
}

.wrapper {
	/*min-height:100%;
	position:relative;*/
    font-family: "Effra", "sans-serif";
    position: relative;
    min-height: 100vh;
}
@media screen and (min-width: 980px) {
    .wrapper:before {
        content: "";
        height: 100%;
        position: absolute;
        left: 50%;
        width: 1px;
        background-color: rgba(0, 0, 0, 0.15);
    }
}

.wrapper>.container{
    font-family: "Effra", "sans-serif";
	padding-bottom:90px;
}

/*body{font-family:Arial, Helvetica, sans-serif; font-size:12px; background:#fff;}*/

img{border:none;}

.dropdown {
    /*display: inline-block;*/
    position: relative;
    overflow: hidden;
    height: 100%;
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box;
    background:#fff; 
    width: 100%;
}

/*input[type="text"], input[type="password"]{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size:15px; background:#fff; border:1px solid #999; padding:8px 2rem;
	-webkit-border-radius: 15px; -moz-border-radius: 15px;border-radius: 30px;width:100%;
}*/
/*input[type="tel"]{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size:15px; background:#fff; border:1px solid #999; padding:9px; width: 100%;
	-webkit-border-radius: 15px; -moz-border-radius: 15px;border-radius: 30px;
}*/
.dropdown:before, .dropdown:after {
    content: '';
    position: absolute;
    z-index: 2;
    top: 18px;
    right: 10px;
    width: 0;
    height: 0;
    border: 4px dashed;
    border-color: #999 transparent;
    pointer-events: none;
}


.dropdown:before {
    border-bottom-style: solid;
    border-top: none;
    color:grey;
}


.dropdown:after {
    margin-top: 7px;
    border-top-style: solid;
    border-bottom: none;
    color:black;
}

@media screen and (max-width: 700px) {
	.dropdown:after {
		top: 28px !important;
	}
}

.dropdown-select {
    position: relative;
    width: 100%;
    margin: 0;
    padding: 6px 8px 6px 10px;
    height: 100%;
    color:black;
    line-height: 30px;
    border: 1px solid #999;
    border-radius: 30px;
    /*border: 1px solid #999;*/
    /*border-radius: 0;*/
    /*for Firefox*/
    -webkit-appearance: none;
    /*for firefox*/
    -moz-appearance: none;
}


.dropdown-select.valid {
    display:inline-block;
    position: relative;
    overflow: hidden;
    height: 100%;
    width: 100%;
    margin: 0;
    border: 1px solid #999;
    border-radius: 30px;
    /*for Firefox*/
    -webkit-appearance: none;
    /*for firefox*/
    -moz-appearance: none;
}

/*for IE10*/
select::-ms-expand {
    display: none;
}

.dropdown-select:focus {
    width: 100%;
    outline-offset: -2px;
}

.dropdown-select > option {
    /*margin: 3px;*/
    /*padding: 6px 8px;*/
    text-shadow: none;
    border-radius: 3px;
    cursor: pointer;
}

/* Fix for IE 8 putting the arrows behind the select element. */

.lt-ie9 .dropdown {
  z-index: 1;
}

.lt-ie9 .dropdown-select {
  z-index: -1;
}

.lt-ie9 .dropdown-select:focus {
  z-index: 3;
}

/* Dirty fix for Firefox adding padding where it shouldn't. */

@-moz-document url-prefix() {
  .dropdown-select {
    padding-left: 6px;
  }
}


/*button{
    cursor: pointer;
}*/
.btn-socialicons {
    display: inline-block;
    width: 46%;
    border-radius: 30px;
    border: thin solid #888;
    white-space: nowrap;
    text-align: center;
    margin: 5px 1%;
    line-height:3.2;
}

.btn-socialicons:hover{
     cursor: pointer;
}
    .btn:hover {
        cursor: pointer;
    }

.btn-google {
    background: white;
    color: #444;
}

.btn-yahoo {
    background: #6E329D;
    color: #fff;
}

.btn-facebook {
    background: #fff;
    color: #444;
}

.btn-windowsliveid {
    background: #014389;
    color: #fff;
}

span.label {
    font-family: serif;
    font-weight: normal;
}

span.icon-google {
    background: url('images/socialicons/google.png') transparent 5px 50% no-repeat;
    display: inline-block;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    padding: 6px;
}

span.icon-yahoo {
    background: url('images/socialicons/yahoo.png') transparent 5px 50% no-repeat;
    display: inline-block;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    padding: 6px;
}

span.icon-facebook {
    background: url('images/socialicons/facebook3.png') transparent 5px 50% no-repeat;
    display: inline-block;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    padding: 6px;
}

span.icon-apple {
    background: url('images/socialicons/apple.png') transparent 5px 50% no-repeat;
    display: inline-block;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    padding: 6px;
}

span.icon-windowsliveid {
    background: url('images/socialicons/microsoft.png') transparent 5px 50% no-repeat;
    display: inline-block;
    vertical-align: middle;
    width: 25px;
    height: 25px;
    padding: 6px;
}

span.buttonText {
    display: inline-block;
    vertical-align: middle;
    padding-right: 10px;
    font-size: 14px;
    font-weight: bold;
    /* Use the Roboto font that is loaded in the <head> */
    font-family: 'Roboto', sans-serif;
}

.break {
    margin: 5px 0;
}

.text-center {
    text-align: center;
}
input[type='submit'].but-blue,
input[type='reset'].but-blue {
    cursor: pointer;
}

.mandatory-label:before { 
   content:"*";
   color:red;   
   font-size: 13px;
}

.mandatory-input:before { 
   content:"*";
   color:red;
   display:block;
   margin-bottom: -7px;
   font-size: 13px;
}

.optional-input:before { 
   content:"";
   color:transparent;
   display:block;
   margin-bottom: 8px;
   font-size: 13px;
}

/*input[type="text"], input[type="password"]{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size:15px; background:#fff; border:1px solid #999; padding:12px;
	-webkit-border-radius: 15px; -moz-border-radius: 15px;border-radius: 30px;
}*/
/*input[type="tel"]{-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; font-size:15px; background:#fff; border:1px solid #999; opacity: 1;
    z-index: 1;	-webkit-border-radius: 15px; -moz-border-radius: 15px;border-radius: 30px;
}*/
*:focus{  outline:none; }
label input[type="checkbox"], input[type="radio"]{
  position: absolute;
  top: 50%;
  left: 15px;
  width: auto;
  color: #d3d3d3;
  transition: 0.2s all;
  cursor: text;
  transform: translateY(-50%);
  font-size: 16px;
  line-height: 26px;
}
select { box-sizing: border-box; font-size: 15px; background: #fff; padding: 10px 2rem; -webkit-border-radius: 15px; -moz-border-radius: 15px; border-radius: 30px;}
fieldset{border: 2px solid #CCC;width: 92%; padding: 8px; margin:0 auto;}
legend { font-size:14px; font-weight:bold; color:#F00;}
	label.small{font-size:15px;}

h1{font-size:1.5em; margin:0 0 5px 0; color:#000000; line-height:140%;}
/*h2{
    font-size: 1.4em;
    padding: 6px 10px;
    display: block;
    color: #000;
    margin: 0 0 10px 0;
    font-weight: bold;
    text-align: center;
    border-bottom: 1px solid grey;
}*/

	/* Heading for Sign up privileges */
	.h1_freesignup{color:#fff !important; background-color:#2E8EC1;}
	.h1_normaltext{color:#555;}



a{color:#000; text-decoration:underline;}
a:hover{text-decoration:none;}
a:active, a:focus {
  outline: 0;
  border: none;
  -moz-outline-style: none;
}

.clear{clear:both; display:block;}
.img-responsive{display:inline-block; height:auto; max-width:100%;}

.success{color:#090;}
.failed{color:#f00;}

.pwd-help{width:100%;}

.icon-pwd-help{border-radius:50%; width:15px; height:15px; border:2px solid #00F; text-align:center; line-height:15px; font-weight:normal; margin-left:5px; color:#00F;}
/*.pwd-help-tooltip{position:absolute; padding:5px; background:#00F; color:#fff; text-align:center; display:none; width:auto;}
	.pwd-help-tooltip .but-close{display:inline-block; border-radius:50%; width:20px; height:20px; background:#fff; color:#00F; text-decoration:none; text-align:center; line-height:20px; margin-right:5px;}*/

.icon_info {padding:8px 30px 5px; background:url(images/mainpage/icon_info.png) no-repeat left 7px; line-height:130%; }
.no-background{background: none !important}

.but-blue{
	border:1px solid #2a2c2f; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; font-family:arial, helvetica, sans-serif; padding-top: 15px; padding-bottom: 15px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0);font-weight:bold; color: #FFFFFF; line-height:1;
	background-color: #000000;
    font-size: 13px;
    width: 100%;
    cursor: pointer;
    
     background-color: #45484d; background-image: -webkit-gradient(linear, left top, left bottom, from(#45484d), to(#000000));
     background-image: -webkit-linear-gradient(top, #45484d, #000000);
     background-image: -moz-linear-gradient(top, #45484d, #000000);
     background-image: -ms-linear-gradient(top, #45484d, #000000);
     background-image: -o-linear-gradient(top, #45484d, #000000);
     background-image: linear-gradient(to bottom, #45484d, #000000);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#45484d, endColorstr=#000000);
}

.but-blue:hover{
     border:1px solid #151617;
     background-color: #2d2f32; background-image: -webkit-gradient(linear, left top, left bottom, from(#2d2f32), to(#4C658F));
     background-image: -webkit-linear-gradient(top, #2d2f32, #4C658F);
     background-image: -moz-linear-gradient(top, #2d2f32, #4C658F);
     background-image: -ms-linear-gradient(top, #2d2f32, #4C658F);
     background-image: -o-linear-gradient(top, #2d2f32, #4C658F);
     background-image: linear-gradient(to bottom, #2d2f32, #4C658F);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#2d2f32, endColorstr=#4C658F);
	/*border:1px solid #4a4b4a;
	background-color: #646464; background-image: -webkit-gradient(linear, left top, left bottom, from(#646464), to(#282828));
	background-image: -webkit-linear-gradient(top, #646464, #282828);
	background-image: -moz-linear-gradient(top, #646464, #282828);
	background-image: -ms-linear-gradient(top, #646464, #282828);
	background-image: -o-linear-gradient(top, #646464, #282828);
	background-image: linear-gradient(to bottom, #646464, #282828);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#646464, endColorstr=#282828);*/
     cursor: pointer;
}

@-moz-document url-prefix() { 
  input[type='submit'].but-blue,
  input[type='reset'].but-blue {
      padding: 7px 10px;
      cursor: pointer;
  }
}


.alertbox{width:280px; border:1px solid #000; margin:0 auto; background:#fff; padding:5px;margin-top: 300px;}
	.alertbox .alertbox-top{text-align:right; background:#0f97d5; padding:5px;}
		.alertbox .alertbox-top .alertbox-title{float:left; font-size:1.5em; font-weight:bold; color:#fff;}
		.alertbox .alertbox-top .but-close{border-radius:50%; width:20px; height:20px; background:#333; color:#fff; text-decoration:none; text-align:center; line-height:20px; float:right;}
	.alertbox .alertbox-msg{margin:30px 10px; text-align:center;}

.alertbox-msg-failed{color:#fc0909; margin : 30px 10px; text-align : center;}

.alertbox-msg-green{color:#090; margin : 30px 10px; text-align : center;}

.error-row{text-align:right; padding-bottom:8px; vertical-align:middle;}
.error{font-size:0.75em; color:#f00;}

.optional{font-style:italic; font-size:0.75em;}

.login-table .login-field{width:100px; vertical-align:middle;}
.login-table .error-row{text-align:right;}

.registration-table{width:100%; max-width:450px;}
	.registration-table input[type="text"], .registration-table input[type="password"], .registration-table select{width:100%;}
	.registration-table .birthdate{display:inline-block; width:27%; margin-right:1%;} /* windows phone render 30% + 30% + 30% + 2% as > 100 ??? */
    .registration-table .birthdate:last-child{margin-right:0; width:27%; }
    .registration-table .fullwidthbirthdate{margin-right:0; width:100% !important;}
    .registration-table .birthyear{display:inline-block; width:100% !important;}

.profile-table{width:100%; margin-bottom:20px;}
	.profile-table input[type="text"], .profile-table input[type="password"], .profile-table select, .profile-table textarea{width:100%;}
	.profile-table .birthdate{display:block; width:30%; margin-right:1%;}
	.profile-table .birthdate:last-child{margin-right:0; width:auto;}
    .profile-table .labelAdded{display:inline-block; width:50%; float:left; margin-right:5px;}
    .profile-table .BirthYearMonth{width:50%;padding:0 !important;}
    .profile-table .fullwidth{width:100%;}
    .profile-table .birthyear{margin-right:1% !important; width:auto;}
    



.password-table{width:100%; max-width:400px;}
	.password-table input[type="text"], .password-table input[type="password"]{width:100%;}

/*.top{background:#ebebeb; display:block; position:relative; padding:10px 0; border-bottom:2px #000 solid;}*/
.top{background:#ffffff; display:block; position:relative; padding:10px 0; border-bottom:2px #202020 solid;}
	.top .container{background:none !important;}

.container{margin:0 auto; position:relative; background:#fff;}
	.container .header{padding:0 0 0 0;}
		.container .header .header-title{display:block; width:100%; margin-top:10px; text-align:center;}
		.container.updateprofile .header .header-nav, .header-nav1{
				/*text-align:center; vertical-align:top; 
				background:#fff; padding:10px 10px; width:100%; margin-bottom:10px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit 
	-moz-box-sizing: border-box;    /* Firefox, other Gecko  
	box-sizing:border-box;
    border-bottom:1px solid grey;*/
                height: 40px;
                font-size: 18px;
                line-height: 18px;
                text-align: center;

                color: rgba(0, 0, 0, 0.75);
			}
			.container.updateprofile .header .header-nav ul{margin:0; padding:0; list-style:none;}
				.container.updateprofile .header .header-nav ul li{display:inline-block; padding:0 5px; font-size:15px;}
					.container .header .header-nav ul li a{margin:0 10px; color:grey; text-decoration:none;}
                    .container .header .header-nav ul li a:active, a:focus {
                                                  outline: 0;
                                                  border: none;
                                                  -moz-outline-style: none;
                                                }
                    
					.container .header .header-nav ul li.hidden-mobile{color:#D6D6D6;}
		.container.updateprofile .header .header-nav1{}
		.container.updateprofile .header .header-title table{width:auto; margin-bottom:10%;}

.sub-logo{background:url(./images/mainpage/meCONNECTLogo.png) no-repeat center !important; margin-right:0; min-height:50px;margin-top: 5%;margin-bottom: 5%;}
.updateprofile .sub-logo{background:url(./images/mainpage/meCONNECTLogo.png) no-repeat center !important; margin-right:0; min-height:50px;margin-top:3%; margin-bottom: 3% }

.wrapper > .container{
    /*padding:45px 45px; 
    -webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit 
	-moz-box-sizing: border-box;    
	box-sizing:border-box;*/
    font-family: "Effra", "sans-serif";
    position: relative;
    /*min-height: 100vh;*/
}
.wrapper > .container .content{font-family: "Effra", "sans-serif";position: relative; min-height: 100vh;margin-bottom:100px;}
.container .content{position:relative;}
	.container .content .login{display:inline-block; width:47%; vertical-align:top; margin:0; padding:0;}
	.container .content .or-separator{display:inline-block; width:12%; text-align:center; font-size:1.25em; font-weight:bold; vertical-align:top; color:#0f97d5; margin:0; padding:0;}
	.container .content .login-left{
			display:inline-block; width:50%; float:left; position:relative;
			padding-right:40px; 
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */ 
	box-sizing:border-box;
    text-align:center;
    border-right:1px solid #EEEEEE;
		}
		.container .content .login-left .logo-row{/*margin-top:40px !important;*/}
	.container .content .login-right{
			display:inline-block; width:50%; float:right; position:relative; 
			padding-left:40px;  
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
	-moz-box-sizing: border-box;    /* Firefox, other Gecko */ 
	box-sizing:border-box;
			
		}
		.container .content .login-right .sociallogin{text-align:left; border-top:1px #EEEEEE solid; margin-top:30px; padding-top:20px;}
        .container .content .login-right .sociallogin_signup{margin-top:20px; text-align:center; padding-top:20px;}
		
			.container .content .login-right .sociallogin ul{margin:0; padding:0; list-style:none;}
            .container .content .login-right .sociallogin_signup ul{margin:0; padding:0; list-style:none;}
			.container .content .login-right .sociallogin ul li{display:inline-block; padding: 10px 20px 20px 0; width:48px; height:48px;}
			.container .content .login-right .sociallogin ul li img{width:48px; height:48px;}
            .container .content .login-right .sociallogin_signup ul li{display:inline-block; padding: 0 15px; width:40px; height:40px;} 

	.login_seperator{color:#000000; font-size:14px; font-weight:600; font-family:Arial-black, Helvetica, sans-serif; text-transform:capitalize;  margin-top:-28px; margin-bottom:10px; text-align:center; }
	.login_seperator span{background:#fff; display:inline-block; padding:0 20px;}
	
	.container .content .login-right .sociallogin.signuppage{border:0 none; border-top:1px #EEEEEE solid; margin:40px 0 30px; padding:20px 0 20px;}
	.sociallogin.signuppage .login_seperator{margin-bottom: -10px;margin-top: -29px; text-align:center; color:#000000; font-size:14px; font-weight:600; font-family:Arial-black, Helvetica, sans-serif;}
	.sociallogin.signuppage .login_seperator span{background:#fff; display:inline-block; padding:0 20px;}

/*Start Subscription*/
.content.updatesubscription input[type="checkbox"]{margin-right:10px;}

.sub-cat{margin:10px 0 0 0; padding:0; list-style:none; text-align:center;}
	.sub-cat li{display:inline-block; border:1px solid #ccc; border-radius:5px; padding:10px 20px; margin:0 5px 10px; cursor:pointer;}
		.sub-cat li.active{border:1px solid #0f97d5;}

.cat-details{margin-top:20px; display:none; background:#fff; padding:10px; color:#000;}
	.cat-details .link-unselect{color:#000 !important;}
	.cat-details .details-left{float:left; width:48%; background:#ccc; padding:5px; margin-bottom:20px;}
	.cat-details .details-right{float:right; width:48%; background:#ccc; padding:5px; margin-bottom:20px;}
	.cat-details .details-centre{background:#ccc; padding:5px; margin-top:10px; }
	.cat-details .qns{font-size:1.15em; font-weight:bold;}
	.cat-details .cat-submit{margin-top:10px; text-align:right;}

.cat-news-details{border-top:5px solid #C94459;}
	.cat-news-details h2{color:#C94459 !important; margin:0; padding:0; background:none !important;}

.cat-tv-details{border-top:5px solid #3571DF;}
	.cat-tv-details h2{color:#3571DF !important; margin:0; padding:0; background:none !important;}

.cat-radio-details{border-top:5px solid #FF9C00;}	
	.cat-radio-details h2{color:#FF9C00 !important; margin:0; padding:0; background:none !important;}

.cat-learning-details{border-top:5px solid #EB5300;}
	.cat-learning-details h2{color:#EB5300 !important; margin:0; padding:0; background:none !important;}

.cat-club-details{border-top:5px solid #1A9593;}
	.cat-club-details h2{color:#1A9593 !important; margin:0; padding:0; background:none !important;}

.cat-entertainment-details{border-top:5px solid #4C4C4C;}
	.cat-entertainment-details h2{color:#4C4C4C !important; margin:0; padding:0; background:none !important;}

.subscription-logo{border:1px solid #ccc; border-radius:5px; display:inline-block; padding:3px 0; margin-right:5px;}
/*End Subscription*/

.logo-row, .logo-row1{display:block; width:100%; /*border-top:1px solid #ccc;*/ margin-top:20px; padding:20px 0 10px;
    text-align: center; border-top: 1px solid #eee;
}

.login-left .logo-row{ border: 0px none; padding: 10px 0;text-align: left;}
	.logo-row ul{padding:0; margin:0; list-style:none;}
		.logo-row ul li{display:inline-block; margin:0 8px 10px 0; width:54px; height:54px; background:#fff; border:1px #ccc solid; border-radius:5px; padding:2px 5px;}
		.logo-row ul li img{width:54px; height:54px;}

 .logo-row1{border: 0px none;/*text-align:left; display:block; width:101%; border-top:1px solid #ccc; margin-top:0px; padding:10px 0;*/}
	.logo-row1 ul{padding:0; margin:0; list-style:none;}
		.logo-row1 ul li{display:inline-block; margin:5px; width:50px; height:50px; background:#fff; border:1px #ccc solid; border-radius:5px; padding:2px 5px;}

.footer{
	background:#202020; color:#fff; display:block; 
	padding:15px 0; 
	position:absolute;
	bottom:0;
	left:0;
	width:100%;
}
	.footer .container{background:none !important;}
		.footer .container .footerlink a{color:#fff; text-decoration:underline;}
		.footer .container .footerlink a:hover{text-decoration:none;}


.but-grey{
    border:1px solid #e9e9e9; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; font-family:arial, helvetica, sans-serif; padding-top: 15px; padding-bottom: 15px; text-decoration:none; display:inline-block;text-shadow: -1px -1px 0 rgba(0,0,0,0);font-weight:bold; color: #000000; line-height:1;
	background-color: #e9e9e9;
    font-size: 13px;
    width: 100%;
    cursor: pointer;
    text-transform: uppercase;
	/*border:1px solid #e9e9e9 !important; -webkit-border-radius: 5px ; -moz-border-radius: 5px;border-radius: 5px;font-family:arial, helvetica, sans-serif; padding: 13px 15px; text-decoration:none; display:inline-block;font-weight:bold; color: #7d7e7d !important; line-height:0 !important;
	background-color: #e9e9e9; background-image: -webkit-gradient(linear, left top, left bottom, from(#e9e9e9), to(#e9e9e9)) !important;
	background-image: -webkit-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: -moz-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: -ms-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: -o-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: linear-gradient(to bottom, #e9e9e9, #e9e9e9);filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e9e9e9, endColorstr=#e9e9e9)! important;*/
}

.but-grey:hover{
    cursor: pointer;
	/*border:1px solid #e9e9e9 !important;
	background-color: #e9e9e9 !important; background-image: -webkit-gradient(linear, left top, left bottom, from(#e9e9e9), to(#e9e9e9)) !important;
	background-image: -webkit-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: -moz-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: -ms-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: -o-linear-gradient(top, #e9e9e9, #e9e9e9) !important;
	background-image: linear-gradient(to bottom, #e9e9e9, #e9e9e9) !important;filter:progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr=#e9e9e9, endColorstr=#e9e9e9) !important;*/
}
    
		.container.updateprofile .content .profile-left .avatar{margin: 0 0 40px 0;}
		.avatar_box{
			text-align:center; 
		}
		.avatar_box table{width:100%;}
		.avatar_box td{min-height:175px;}
        .avatar_box img{ max-height: 175px; max-width: 270px; border-radius:50%; border:1px solid grey; }
		
		.container.updateprofile .content .profile-left .avatar_actions{
			padding:15px 20px;  overflow:hidden; text-align:center; line-height: 1.5rem; font-size: 0.8rem;
		}
			.avatar_actions a{color:#000000 !important; font-size:15px;}
            .avatar_actions label{color:#000000 !important;}
	
	    
@media only screen and (min-width: 980px) {
	.hidden-desktop{display:none !important;}
	
	.wrapper > .container, .top > .container, .footer > .container{width:1019px;}

    
	
	.top .logo-mediacorp{width:210px; height:50px; background:url(images/mainpage/logo-mediacorp-colored.png); margin-left:45px;}

	
    .wrapper > .container{padding:0 0; }
	.container .content{position:relative;}
	
	.sub-cat li img{width:64px;}
	
	.container .header .header-nav ul li.active a {color: #333; text-decoration:none; font-weight:bold; cursor:default; outline:none !important }
	:link:focus, :visited:focus{outline: none;}
	/*Start Update Profile*/			
	.container.updateprofile .content .profile-left{
		display:inline-block; width:300px; margin-right:35px;margin-left:60px;margin-top: 160px;
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
		-moz-box-sizing: border-box;    /* Firefox, other Gecko */ 
		box-sizing:border-box;		
	}

	
	
	.container.updateprofile .content .profile-right{
		display:inline-block; width:541px; vertical-align:top;
		-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
		-moz-box-sizing: border-box;    /* Firefox, other Gecko */ 
		box-sizing:border-box;		
		
	}
	/*End Update Profile*/
	
	.footer .container .copyright{float:left; padding:0 10px;}
	.footer .container .footerlink{float:right; padding:0 10px;}
}

@media only screen and (min-width: 768px) and (max-width: 979px) {

    .alertbox{ margin-top: 200px;}

	.hidden-tablet{display:none !important;}
	
	.container{width:710px;}
	/*.wrapper > .container {padding:20px;}*/
	.container .content .login-left,
	.container .content .login-right{
		width:50%;
	}
			.container .content .login-left{padding-right:30px}
			.container .content .login-right{padding-left:30px;	}	
    .container.updateprofile .header .header-nav ul li { display: inline-block; padding: 0 5px; font-size: 15px;}
		
	.sub-cat li{margin:0 3px 8px;}
		.sub-cat li img{width:64px;}
	
	.top .logo-mediacorp{width:210px; height:50px; background:url(images/mainpage/logo-mediacorp-colored.png); margin-left:20px;}
	
	.container .header .header-nav ul li.active a{text-decoration:none; font-weight:bold; cursor:default; color:#000;}
	
	/*Start Update Profile*/
	.container.updateprofile .content .profile-left{display:inline-block; width:240px; margin-right:20px;margin-top: 140px;}
		.container.updateprofile .content .profile-left .avatar{margin-bottom:40px;}
	.container.updateprofile .content .profile-right{display:inline-block; width:404px; vertical-align:top;}
	
	
	/*End Update Profile*/
	
	.container .logo-row ul li{display:inline-block; margin:0 5px 8px 0; width:48px; height:48px; background:#fff; border:1px #ccc solid; border-radius:5px; padding:2px 5px;}
		.container .logo-row ul li img{width:48px; height:48px;}
	
	.footer .container .copyright{float:left; padding:0 10px;}
	.footer .container .footerlink{float:right; padding:0 10px;}
}

@media only screen and (min-width: 0px) and (max-width: 767px) {

    /* Input textbox*/
    .profile-table input[type="text"], .profile-table input[type="password"], .profile-table select, .profile-table textarea {
        width:100%;
    }
    .alertbox{ margin-top: 100px;}

	.wrapper>.container{padding-bottom:0px;}
	.hidden-mobile{display:none !important;}
	
	h1{}
	h2{}
	
	.container{width:100%; font-size:1em; text-align:center;}
	
	.top{border-bottom:none;}
	.top .logo-mediacorp{width:100px; height:24px; background:url(images/mainpage/logo-mediacorp-colored-small.png); background-size: 100px 24px; -webkit-background-size: 100px 24px; margin-left:10px;}
	
	.top .but-blue{position:absolute; right:5px; top:0;}
	
	.container.updateprofile .header .header-title .sub-logo{margin:0 auto;}

		.container .logo-row ul li{display:inline-block; margin:0 5px 8px 0; width:48px; height:48px; background:#fff; border:1px #ccc solid; border-radius:5px; padding:2px 5px;}
		.container .logo-row ul li img{width:48px; height:48px;}	
	
	.wrapper > .container{padding: 20px}
	.container .content{position:relative;}
			.container .content .login-left{text-align:center;}
			.container .content .login-left,
			.container .content .login-right{
				padding:0px; border:0px none;
				width:100%; float:none;
				-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit */
				-moz-box-sizing: border-box;    /* Firefox, other Gecko */ 
				box-sizing:border-box;
				
			}
			.signup.hidden-desktop.hidden-tablet{border-top:1px #ccc solid; text-align:center; margin-top:20px; padding-top:20px;}
		
			.container .content .login-left .sub-logo{margin:0 auto; min-height:0;}
			.container .content.register .login-left{margin-bottom:20px;}
				.container .content.register .login-left .sub-logo{}
				.container .content.register .login-left .haveaccount{display:inline-block; text-align:center; margin-top:15px;}

			.container .content .login-right h1{text-align:center;}
			.container .content .login-right .sociallogin{margin-top:20px; text-align:center; border-top:1px #ccc solid; padding-top:20px;}
				.container .content .login-right .sociallogin ul{margin:0; padding:0; list-style:none;}
				.container .content .login-right .sociallogin ul li{
						display:inline-block; padding: 10px 10px 20px 0; width:48px; height:48px;
					}
					.container .content .login-right .sociallogin ul li img{/*width:40px;*/}
			.container .content .login-right .signup{margin-top:20px; text-align:center; border-top:1px #ccc solid; padding-top:20px;}
				.container .content .login-right .signup a{display:block;}
		.container .content .or-separator{display:block; width:100%; text-align:center; font-size:1.25em; font-weight:bold; vertical-align:top; color:#0f97d5; margin:20px 0; padding:0;}
		.container .content .sociallogin{display:block; width:100%; vertical-align:top; margin: 0; padding:0;}
			.container .content .sociallogin ul{margin:0; padding:0; list-style:none;}
				.container .content .sociallogin ul li{display:inline-block; padding: 0 5px;}
	
	/*Start Update Profile*/		
	.container.updateprofile .header .header-nav{display:block; vertical-align:top; margin-top:10px; background:none; padding:0; margin:0; width:100%; position:absolute; top:-38px;  right:5px; text-align:right;}
		.container.updateprofile .header .header-nav ul{margin:0; padding:0; list-style:none; z-index:9999; width:180px; display:block; position:absolute; right:0; top:23px; display:none;}
			.container.updateprofile .header .header-nav ul li{ display:block; background:dimgrey; text-align:center; margin:0; padding:15px 0; border-bottom:#ccc 1px solid; float:none;}
				.container.updateprofile .header .header-nav ul li a{color:#fff; text-decoration:none;}
	.container.updateprofile .content .profile-left{display:block; margin-bottom:10px;margin-top: 40px;}
		.container.updateprofile .content .profile-left .avatar{margin:0 auto;}
	.container.updateprofile .content .profile-right{display:block;}
	/*End Update Profile*/
	
	.sub-cat li{display:inline-block; border:1px solid #ccc; border-radius:5px; padding:5px; margin:0 1px 5px; cursor:pointer;}
		.sub-cat li img{width:48px;}
	
	.cat-details .details-left{float:none; display:block; width:auto; background:#ccc; padding:5px; margin-bottom:20px;}
	.cat-details .details-right{float:none; display:block; width:auto; background:#ccc; padding:5px; margin-bottom:20px;}
	
	.logo-row{text-align:center;}
    .logo-row1{text-align:center;}
	
	.footer{position:static;}
	.footer .container .copyright{display:block; padding:0 10px; text-align:center;}
	.footer .container .footerlink{display:block; padding:10px 10px 0 10px; text-align:center;}
}

    .font13{
        font-size:13px;
    }

        @import url('https://fonts.googleapis.com/css?family=Lato');
         .ugcTitle {
         font-family: 'Lato', sans-serif;
         font-size: 24px;
         font-weight: 700;
		 color: #002563;
         letter-spacing: 0.2px;
         margin-top: 20px;
         margin-bottom: 5px;
         }
         .ugcMsg {
         font-family: 'Lato', sans-serif;
         font-size: 17px;
         font-weight: 400;
         color: #000;
         line-height: 22px;
         }
         .gotoHomepage {
         border-top: 1px solid #aeaead;
         width:100%;
         max-width:300px;
         font-family: 'Lato', sans-serif;
         font-size: 14px;
         font-weight: 400;
         color: #000;
         margin-top: 45px;
         padding-top:20px;
         }
		 .bannerMediacorp{		 
         display: inline-block;		 
         height: 48px;
         width:100%;
         max-width : 350px;
		 margin:20px auto;
		 background-color: #fff;
		 background-image: url(images/mainpage/logo-line-data-svg-data.svg);
		 background-size: 50%;
         background-repeat: no-repeat;
		 background-position: center;	
		 }
/* New Addon */
@media only screen and (min-width: 767px) {
    .container.updateprofile .header .header-nav, .header-nav1 {
        /*text-align:center; vertical-align:top; 
				background:#fff; padding:10px 10px; width:100%; margin-bottom:10px;
	-webkit-box-sizing: border-box; /* Safari/Chrome, other WebKit 
	-moz-box-sizing: border-box;    /* Firefox, other Gecko 
	box-sizing:border-box;
    border-bottom:1px solid grey;*/
        height: 40px;
        font-size: 20px;
        line-height: 50px;
        text-align: center;
        color: rgba(0, 0, 0, 0.75);
    }
}

.SignupCardForDesktop{
    box-shadow: 0 4px 8px 0 rgba(0,0,0,0.2);
    transition: 0.3s;
    width: 110%;
    text-align: center;
    border-radius: 10px;
    margin-left:-15px;
}
.CardcontainerForDesktop{
    padding: 30px 23px;
    margin-top: 10%;
}
.SignupCardForMobile{
    width: 100%;
}
.CardcontainerForMobile{
    margin-top: 10%;
}

.password-advisory-message {
	text-align: justify;
	line-height: 16.5px;
	max-width: 100%;
	margin: auto;
	padding: 0;
	font-size: 13px;
}

.mepass__form--create {
	text-align: left;
}

.mepass__form--create .mp-input-dob {
	text-align: center;
}

@media only screen and (max-width: 767px) {
	.mepass__form--signin .password-input {
		margin-bottom: 12px !important;
	}
}