/* Common elements for the HTML file */
@media (min-width: 240px) and (max-width: 780px) {
    #payment_zone tbody tr:first-child td, th {
        background-color: #999999;
    }

    /* Common elements for the HTML file */
    /*@font-face
        {
            font-family: 'open_sansregular';
            src: url('fonts/opensans-regular-webfont.eot');
            src: url('fonts/opensans-regular-webfont.eot?#iefix') format('embedded-opentype'), url('fonts/opensans-regular-webfont.woff') format('woff'), url('fonts/opensans-regular-webfont.ttf') format('truetype'), url('fonts/opensans-regular-webfont.svg#open_sansregular') format('svg');
            font-weight: normal;
            font-style: normal;
        }        
        html, body
        {
            margin: 0;
            padding: 0;
            background: #e1e3e4;
            font-family: 'open_sansregular' ,Verdana,sans-serif;
            font-size: 14px;            
        } */
    #payment_zone td, #payment_zone p, #payment_zone span, #payment_zone input, #payment_zone a {
        font-family: open-sans,Verdana,sans-serif;
        font-size: 14px;
    }
        #payment_zone a
        {
            background: none !important;
            font-size: 9px;
        }
        #payment_zone a:hover
        {            
            font-size: 9px;
            background: none !important;
        }
        #payment_zone br
        {
            height: 1px;
        }
        #payment_zone input
        {
            background: none repeat scroll 0 0 #ffffff;
            border: 1px solid #ffffff;
            border-radius: 3px;
            font-family: open-sans,Verdana,sans-serif;
            color: #999999;
            -moz-box-sizing: border-box;
            -webkit-box-sizing: border-box;
            box-sizing: border-box;
            height: 32px;
        }
        #payment_zone form
        {
            margin: 0px;
            padding: 0px;
            border: 0px;
        }
        #payment_zone select
        {
            border: 1px solid #ffffff;
            border-radius: 3px;
            font-family: open-sans,Verdana,sans-serif;
            color: #999999;
            margin: 0 2% !important;
            text-align: left;
            font-weight: normal;
            height: 32px;
	        line-height:32px;
			webkit-background:#ffffff !important;
        }
        
        /* Lock Header */
        #main
        {
            width: 100%;
        }
        #inner
        {
            min-width: 320px !important;
            max-width: 748px !important;
            width: 100%;
            margin: 0 auto;
            background: #f1f1f2;
        }
        /*#content
        {
            width: 300px !important;
            padding: 0 10px;
            margin: 0 auto;
        }*/
        .securedBG
        {
            background: #999999;
        }        
        .secured
        {
            padding: 8px 20px 0px 40px;
            color: #ffffff;
            width: 235px;
            margin: 0 auto;
            background: url("lock.png") 5px no-repeat #999999;
            height: 30px;
        }
		
		/* PaymentZone main Div */
        .mainContainerPaymentzone
        {
            padding: 0px;
            background: white;
            font-size: 14px;            
            line-height: 20px;
			text-align:center !important;
		}       
        
        /* Payment method list page - PM logo */
		tr#titleP
        {
            text-align: center;
        }
		table.ncoltableTitle
        {
            width: 100%;
            height: auto;
        }
        span.classMF
        {
            color: #090909;
        }	
		.ncolh1 input[type="image"]
		{
			margin:10px;
		}				
		.ncolh1 p
		{
			line-height:25px;
		}
        input.NCOLINIM
        {
            width: 90px;
            height: 55px;
			margin: 13px !important;
			display: inline-block;
        }
		td.ncolh1
        {            
	       line-height:15px;
           text-align: left;
           font-weight: bold;            
	       font-family: open-sans,Verdana,sans-serif;
	       background-color:#ffffff;
	       color:#999999;
        }
		
		/* Payment Detail Div TR TD CSS*/
        td.ncolinput IMG
        {
            height: 35px;
            width: 60px;
        }
        td.ncoltxtl
        {
            font-family: open-sans ,Verdana,sans-serif;            
            font-size: 14px;
            background-color:#ffffff;
			text-align : left !important;
			font-weight : bold !important;
			vertical-align:bottom;
        }
		td.ncoltxtl2
		{
			text-align: left;
			font-family: open-sans ,Verdana,sans-serif;
			white-space: nowrap;
			display: block;
			font-size: 14px;
			background-color:#ffffff;
		}
        td.ncoltxtr
        {
            text-align: left;
            font-weight: normal;
            font-family: open-sans ,Verdana,sans-serif;
            font-size: 14px;
         /*   background-color:#ffffff;*/
		 display: block;
         overflow: hidden;
         text-overflow: ellipsis;
         white-space: nowrap !important;
         word-wrap: break-word !important;
        }
        td.ncoltxtr b
        {
            font-weight: normal;
        }        
        td.ncolinput
        {
            text-align: left;
            font-weight: normal;
            font-size: 14px;
            font-family: open-sans ,Verdana,sans-serif;
            display: block;
            box-shadow: none !important;
        }
        input.ncol
        {
            background-color: #ffffff;
            height: 40px;
            font-size: 14px;
            text-align: center;
            padding: 0px;
            font-family: open-sans  ,Verdana,sans-serif;
            margin:  0 35px 20px;
            border-bottom: 1px solid #999999;
            border-radius: 0px;	    
            -webkit-appearance: none !important;
            -webkit-border-radius: 0 !important;
        }
		
		/*used to show transaction status */
        td.ncoltxtc
        {
          /*  background-color:#ffffff;*/
	    	color:#999999;
            padding: 0px;
            text-align: center !important;
            font-weight: normal;
            font-size: 14px;
            border-top: 0px solid #ffffff;
            font-family: open-sans ,Verdana,sans-serif;

        }
        td.ncoltxtc h3
        {   
            text-align: center;
            font-weight: normal !important;            
            padding: 5px;
            font-family: open-sans ,Verdana,sans-serif;
        }		
		td.ncoltxtc table.ncoltable2
        {   
            box-shadow: none !important;
			-webkit-box-shadow: none !important;
			width: 280px !important;
        }
		td.ncoltxtc b
        {
            text-align: center !important; 
        }				
		td.ncoltxtc h4
		{
			margin:0 !important;
		}
        td.ncoltxtc small
        {
            font-weight: normal !important;  
            height: 30px;
            font-family: open-sans ,Verdana,sans-serif;
            text-align: center !important;
        }        
        td.ncoltxtmessage
        {
            background-color: #ffffff;
            color: #999999;
            text-align: left;
            font-weight: normal;
        }
        		
		/* Use for Footer images(Logo)*/
		td.ncollogoc
        {
            text-align: center;
            font-weight: normal;
            font-size: 14px;
            padding: 2px;
            vertical-align: top !important;
        }
        td.ncollogoc IMG
        {
            width: 90px;
            height: 55px;
            margin-right: 4px;
        }
        IMG#NCOLPP
        {
            width: 100%;
        }
		.ncollogoc td .ncol
        {
            width: auto;
            padding-right: 10px;
            padding-left: 10px;
            cursor:pointer;
        }
      	.ncollogoc input.ncol
      	{
	    	margin-top:10px !important;
            -webkit-appearance: none !important;
            -webkit-border-radius: 0 !important;
		}
		td.ncollogol
        {
            background-color: #ffffff;
            color: #999999;
            text-align: right;
            font-weight: bold;
        }
        td.ncollogor
        {
            background-color: #ffffff;
            color: #999999;
            text-align: left;
            font-weight: bold;
        }
		        
        /*Wait window message div*/
      	div.WaitMsgClass
		{
			display:none;
			background-color: #FFFFFF;
			border: solid #CCCCCC 4px;
			padding: 10px !important;
			color: #000000;
			font-family: Verdana;
			font-weight: bold;
			position: absolute;
		    width: 400px !important;
		}
		.WaitMsgP
		{
			display:inline;
		}				
		.WaitMsgP img
		{
			margin-right:10px;
		}  
		
		/* Element specific */
		select[title="CVC"]
		{
			width:150px !important;
		}
        
		/* Header Table */
    table.ncoltable1 {
        width: 100%;
        margin: 0 auto;
        min-width: 300px !important;
        word-wrap: break-word !important;
        background-color: #999999;
        padding-bottom: 0;
    }
            table.ncoltable1 td {
                text-align: left;
                padding: 7px 7px;
                margin: 0 0 0 0;
                font-size: 14px;
                font-family: open-sans,Verdana,sans-serif;
                word-wrap: break-word !important;
                background-color: #999999;
                color: #ffffff;
            }
        
		/*Payment Detail Middle Table */
        table.ncoltable2
        {
            min-width: 300px !important;
            padding: 10px 0 10px 0;
            margin-top: 2%;
            color: #ffffff;
            margin: 0 auto;
            background: #999999;
            -webkit-box-shadow: inset 0 22px 8px -20px rgba(0,0,0,0.9);
            -moz-box-shadow: inset 0 22px 8px -20px rgba(0,0,0,0.9);
            box-shadow: inset 0 22px 8px -20px rgba(0,0,0,0.9);
            display: table;
        }       
        table.ncoltable2 tr
        {	    
            margin:8px 0 0 0;
        } 
        table.ncoltable2 tr td
        {
            display: block !important;
            padding: 10px 10px 0 10px;			
        }
		table.ncoltable2 ul.paymethods span
		{
			background-color: #999999 !important;            
            color: #ffffff !important;
			font-size:12px !important;    
		}
        table.ncoltable2 tr td a
        {
            line-height: 30px;
	    	color:#ffffff !important;	   
            margin:2%;
        }
		table.ncoltable2 tr td ul.paymethods ul.brands a
        {
            line-height: 30px;
	    	color:#ffffff !important;
			margin:2%;
			font-size:9px !important;
        }
        table.ncoltable2 td
        {
            background-color: #999999;
            display: block;
            width: auto;
            color: #ffffff;
        }   
		table.ncoltable2 td.ncolh1 h3
		{
			font-size:12px;
		}    
        table.ncoltable2 td.ncoltxtl2
        {
            display: block;
            text-align: left;
	        margin: 10px 2% 5px 2%;
        }        	
		table.ncoltable2 td.ncolinput IMG
        {            
            margin: 0 2%;
        }
        table.ncoltable2 td.ncolinput input
        {
            width: 96%;
            margin: 2px 2%;
        }
		table.ncoltable2 td.ncoltxtc div.tc input[type="checkbox"]
		{
            height:15px !important;
        }
        table.ncoltable2 td.ncolinput select
        {
            width: 70px;            
        }
		table.ncoltable2 td.ncolline1 span
        {
            color:#ffffff;
            background-color:#999999 !important;
	        font-size:12px;
        }
		table.ncoltable2 td.ncoltxtl span
		{
            color:#ffffff;
            background-color:#999999 !important;
	    	font-size:10px;
	    	margin:0 2%
		}
        table.ncoltable2 td.ncolline2 span
        {
            color:#ffffff;
            background-color:#999999 !important;
	    	font-size:12px;
        }
        table.ncoltable2 td input.ncol
        {
            background-color: #c6ef84 !important;
            color: #134600 !important;
            margin: 0px;
            width: 100%;
            margin-bottom: 12px !important;
            border: 0;
            border-radius: 0 !important;
	        cursor:pointer;
            height: 40px !important;
        }
		table.ncoltable2 td p small
        {
            line-height: 20px !important;
        }
		table.ncoltable2 td.ncoltxtc small
        {            
            line-height:20px !important;
        }		
		table.ncoltable2 .ncolline2
		{
			text-align:left !important;
		}
		table.ncoltable2 .ncolline1
		{
			text-align:left !important;
		}
        
		/* Footer Table */
        table.ncoltable3
        {
            width: 100%;
            margin: 0 auto;
			min-width: 300px !important;
        }
        table.ncoltable3 td
        {
            background: #ffffff !important;
        }	
        
        /* for Direct Debit payments */
        .DDtxt
        {
            text-align: left;
            margin-left: 2px;
            font-weight: normal;
            margin-top: 0;
		    word-wrap: break-word !important;
        }
        .DDlabel
        {
            text-align: left;
            margin-left: 4em;
            font-weight: normal;
            margin-top: 0;
        }
        .DDdata
        {
            font-weight: normal;
            margin-top: 0;
        }
        .MKtxt
        {
            text-align: left;
            font-weight: bold;
            margin-left: 2em;
            margin-top: 0;
        }
        .MKlabel
        {
            text-align: left;
            margin-left: 4em;
            font-weight: normal;
            font-style: italic;
            margin-top: 0;
        }
        td.ncoltxtr p.MKlabel
        {
            margin-left: 0;
        }
        .MKdata
        {
            font-weight: normal;
            margin-top: 0;
        }
        .DDimp
        {
            font-weight: bold;
            margin-left: 2em;
            text-align: left;
            margin-top: 0;
        }
        .DDsection
        {
            font-weight: bold;
            margin-left: 0em;
            text-align: left;
            margin-top: 1em;
            margin-bottom: 0em;
        }
		.fieldTitle 
		{
			font-size: small;
			font-weight: bold; 
			vertical-align: baseline;
			text-align : left !important;
		}
		.fieldValue 
		{
			font-size: small;
			text-align: left;
		}

		/* Faishon cheque */
		.wraptext 
		{
			word-wrap: break-word; 
			width: 150px;
		}
		.wrapdatatext 
		{ 
			width: 285px;
		}

		/* for 3XCB payments */
		div.container div#pers_data div.additional 
		{
			float: left;
			width: 260px;
		}
		select#inp_ctyob,select#city_of_birth
		{
			width:250px !important;
		}
		div.container div#pers_data div.part1
		{
			text-align: left;
			width: 260px !important;
		}
		div.container div#pers_data div.part2 
		{
			text-align: left;
			width: 260px !important;
			float: none !important;
		}
		div.container div#pers_data div.additional 
		{
			text-align: left;
			width: 260px !important;
		}
		div#bank_data ul.brandlist 
		{
			margin-top: 0 !important;
			padding: 0;
			width: 260px !important;
		}
		div#bank_data label.seperator 
		{
			text-align: center;
			width: 10px !important;
		}
		div#bank_data label 
		{
			display: block;
			font-weight: bold;
			padding-right: 4px;
			text-align: left !important;
			width: 260px !important;
		}
		div.container div.cnt_part 
		{
			padding: 2px;
			text-align: left !important;
		}
		div.container div#pm_logo 
		{
			text-align: center !important;
		}
		#ul_payments
		{
			padding :0 !important;
		}
		div#bank_data input[type="text"], div#bank_data select 
		{
			margin-left: 0 !important;
		}

		/* for BCMC */
		.PayCardButton
		{ 
			height: 120px !important;
		}
		.paymentZone 
		{ 
			min-width:300px !important;
		}	
		.paymentZone a:hover 
		{
			font-weight: bold !important;
			font-size: 18px !important;
			color: #fff !important;
		}
		.elehide
		{
			display: none !important; 
		}

		/*for Bank transfer */
		table.ncoltable1 td.ncoltxtc
		{
			text-align:center !important;
		}

		/* CVC & Expiry Date Width */
		.width96
		{
			width:96px !important;
		}
}