
/*Pavanam-Regular.ttf

*/

@font-face {
  font-family: Tamil;
  src:   url(./MeeraInimai-Regular.ttf) format('truetype');
}



/*
@font-face {
  font-family: Verdana;
  src:   url(./css/verdana.ttf) format('truetype');
}
*/
@font-face {
  font-family: Mont;
  src:   url(./Montserrat-Regular.ttf) format('truetype');
}



div {
  font-family: Mont, Tamil;
}

label {
  font-family: Mont, Tamil;
}

p {
  font-family: Mont, Tamil;
}


.arivimainmenuicons {
	display: table;
	margin-left: auto;
	margin-right: auto;
	width: 100%;
}

.arivitabcell {
	display: table-cell;
	text-align: center;
	vertical-align: middle;
}

.arivicontainer {
	display: inline-table;
	margin-left: 5px;
	margin-right: 5px;
	margin-top: 5px;
	background-color:#fff;
}

.arivioi {
	display: block;
	text-align: center;
}

.ariviim {
	text-align: center;
	display: inline;
	width: 80px;
	height: 80px;
	
	/*border: 0px solid #ff7733;*/
	border: 2px solid #fff;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-khtml-border-radius: 7px;
	-webkit-border-radius: 7px;
}


.arivicatt {
	margin-bottom:0px;
	padding-right:15px; 
	padding-left:15px;
	padding-top:15px;
	padding-bottom:15px;
	text-align: center;
	font-weight:normal;
	font-size:0.9em;
	font-family: Tamil, Verdana, Geneva, sans-serif;
	color:#fff;
	text-decoration: none;
}




.arivioimm {
	display: block;
	text-align: center;
}

.ariviimmm {
	text-align: center;
	display: inline;
	width: 90%;
	/*height: 120px; */
	border: 2px solid #fff;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-khtml-border-radius: 7px;
	-webkit-border-radius: 7px;
}


.arivioitem {
	display: block;
	text-align: center;
}

.arivimitem {
	text-align: center;
	display: inline;
	width: 20px;
	height: 80px;
	border: 1px solid #fff;
	border-radius: 7px;
	-moz-border-radius: 7px;
	-khtml-border-radius: 7px;
	-webkit-border-radius: 7px;
}







.th-groups th {
    background-color: rgba(0,0,0,0.07);
    border-right: 1px solid #fff;
    text-align: center;
}

/*
@media screen and (max-width: 32em) {

    .financial-table-reflow th: first-child {
        color: #fff;
        background-color: #555;
        font-size: 1.0em;
        padding: .3em .6em .3em .6em;
        -webkit-text-shadow: none;
        -moz-text-shadow: none;
        text-shadow: none;
    }

    .financial-table-reflow th: first-child .ui-table-cell-label {
        display: none;
    }

    .ui-table-reflow th .ui-table-cell-label-top,
    .ui-table-reflow td .ui-table-cell-label-top {
        font-weight: bold;
        color: #319B47;
        font-size: 1.0em;
    }
}
*/

@media screen and (max-width: 20em) {

    /* Style the first cell in a row in a dark bar */
    .financial-table-reflow th:first-child {
        color: #fff;
        background-color: #555;
        font-size: 1em;
        padding: 0.3em 0.6em;
        text-shadow: none;
    }

    /* Hide the label in the first cell */
    .financial-table-reflow th:first-child .ui-table-cell-label {
        display: none;
    }

    /* Make the grouped header labels green */
    .ui-table-reflow th .ui-table-cell-label-top,
    .ui-table-reflow td .ui-table-cell-label-top {
        font-weight: bold;
        color: #319B47;
        font-size: 1em;
    }
}



@media screen and (min-width: 10em) {

    .financial-table-reflow td,
    .financial-table-reflow th,
    .financial-table-reflow tbody th,
    .financial-table-reflow tbody td,
    .financial-table-reflow thead td,
    .financial-table-reflow thead th {
        display: table-cell;
        margin: 0;
    }

    .financial-table-reflow td .ui-table-cell-label,
    .financial-table-reflow th .ui-table-cell-label {
        display: none;
    }
}

@media (max-width: 20em) {
    .financial-table-reflow td,
    .financial-table-reflow th {
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        clear: left;
    }
}









/* extra mobile css from the site for the table etc*/


.th-groups th {
    background-color: rgba(0,0,0,0.07);
    border-right: 1px solid #fff;
    text-align: center;
}

/*
@media screen and (max-width: 72em) {

    .financial-table-reflow th: first-child {
        color: #fff;
        background-color: #555;
        font-size: 1.2em;
        padding: .3em .6em .3em .6em;
        -webkit-text-shadow: none;
        -moz-text-shadow: none;
        text-shadow: none;
    }

    .financial-table-reflow th: first-child .ui-table-cell-label {
        display: none;
    }

    .ui-table-reflow th .ui-table-cell-label-top,
    .ui-table-reflow td .ui-table-cell-label-top {
        font-weight: bold;
        color: #319B47;
        font-size: 1.1em;
    }
}
*/

@media screen and (max-width: 20em) {
    /* Style the first cell in a row in a dark bar */
    .financial-table-reflow th:first-child {
        color: #fff;
        background-color: #555;
        font-size: 1.2em;
        padding: .3em .6em;
        text-shadow: none;
    }

    /* Hide the label in the first cell */
    .financial-table-reflow th:first-child .ui-table-cell-label {
        display: none;
    }

    /* Make the grouped header labels green */
    .ui-table-reflow th .ui-table-cell-label-top,
    .ui-table-reflow td .ui-table-cell-label-top {
        font-weight: bold;
        color: #319B47;
        font-size: 1.1em;
    }
}

/* Media query to show as a standard table at wider widths, must be very wide for this table */
@media screen and (min-width: 20em) {
    /* Show the table header rows */
    .financial-table-reflow td,
    .financial-table-reflow th,
    .financial-table-reflow tbody th,
    .financial-table-reflow tbody td,
    .financial-table-reflow thead td,
    .financial-table-reflow thead th {
        display: table-cell;
        margin: 0;
    }
    /* Hide the labels in each cell */
    .financial-table-reflow td .ui-table-cell-label,
    .financial-table-reflow th .ui-table-cell-label {
        display: none;
    }
}
/* Hack to make IE9 and WP7.5 treat cells like block level elements */
/* Applied in a max-width media query up to the table layout breakpoint so we don't need to negate this*/
@media (max-width: 20em) {
    .financial-table-reflow td,
    .financial-table-reflow th {
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        clear: left;
    }
}












/*more */



/* These apply across all breakpoints because they are outside of a media query */
/* Make the labels light gray all caps across the board */
.movie-list thead th,
.movie-list tbody th .ui-table-cell-label,
.movie-list tbody td .ui-table-cell-label {
    text-transform: uppercase;
    font-size: .7em;
    color: rgba(0,0,0,0.5);
    font-weight: normal;
}
/* White bg, large blue text for rank and title */
.movie-list tbody th {
    font-size: 1.2em;
    background-color: #fff;
    color: #77bbff;
    text-align: center;
}
/*  Add a bit of extra left padding for the title */
.movie-list tbody td.title {
    padding-left: .8em;
}
/*  Custom stacked styles for mobile sizes */
/*  Use a max-width media query so we don't have to undo these styles */
@media (max-width: 20em) {
    /*  Negate the margin between sections */
    .movie-list tbody th {
        margin-top: 0;
        text-align: left;
    }
    /*  White bg, large blue text for rank and title */
    .movie-list tbody th,
    .movie-list tbody td.title {
        display: block;
        font-size: 1.2em;
        line-height: 110%;
        padding: .5em .5em;
        background-color: #fff;
        color: #77bbff;
        -moz-box-shadow: 0 1px 6px rgba(0,0,0,.1);
        -webkit-box-shadow: 0 1px 6px rgba(0,0,0,.1);
        box-shadow: 0 1px 6px rgba(0,0,0,.1);
    }
    /*  Hide labels for rank and title */
    .movie-list tbody th .ui-table-cell-label,
    .movie-list tbody td.title .ui-table-cell-label {
        display: none;
    }
    /*  Position the title next to the rank, pad to the left */
    .movie-list tbody td.title {
        margin-top: -2.1em;
        padding-left: 2.2em;
        border-bottom: 1px solid rgba(0,0,0,.15);
    }
    /*  Make the data bold */
    .movie-list th,
    .movie-list td {
        font-weight: bold;
    }
    /* Make the label elements a percentage width */
    .movie-list td .ui-table-cell-label,
    .movie-list th .ui-table-cell-label {
        min-width: 20%;
    }
}
/* Media query to show as a standard table at wider widths */
@media ( min-width: 20em ) {
    /* Show the table header rows */
    .movie-list td,
    .movie-list th,
    .movie-list tbody th,
    .movie-list tbody td,
    .movie-list thead td,
    .movie-list thead th {
        display: table-cell;
        margin: 0;
    }
    /* Hide the labels in each cell */
    .movie-list td .ui-table-cell-label,
    .movie-list th .ui-table-cell-label {
        display: none;
    }
}
/* Hack to make IE9 and WP7.5 treat cells like block level elements */
/* Applied in a max-width media query up to the table layout breakpoint so we don't need to negate this */
@media ( max-width: 20em ) {
    .movie-list td,
    .movie-list th {
        width: 100%;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        float: left;
        clear: left;
    }
}


/*more*/




.th-groups th {
    text-align: center;
    background-color: rgba(0,0,0,.1);
    border-right: 1px solid #fff;
}
.th-groups th.totals {
    background-color: rgba(0,0,0,.5);
    color: #fff;
    text-shadow: none;
}
/* Show priority 1 at 320px (20em x 16px) */
@media screen and (min-width: 20em) {
    th.ui-table-priority-1,
    td.ui-table-priority-1 {
        display: table-cell;
    }
}
/* Show priority 2 at 480px (30em x 16px) */
@media screen and (min-width: 20em) {
    th.ui-table-priority-2,
    td.ui-table-priority-2 {
        display: table-cell;
    }
}
/* Show priority 3 at 640px (40em x 16px) */
@media screen and (min-width: 20em) {
    th.ui-table-priority-3,
    td.ui-table-priority-3 {
        display: table-cell;
    }
}
/* Show priority 4 at 800px (50em x 16px) */
@media screen and (min-width: 20em) {
    th.ui-table-priority-4,
    td.ui-table-priority-4 {
        display: table-cell;
    }
}
/* Show priority 5 at 960px (60em x 16px) */
@media screen and (min-width: 20em) {
    th.ui-table-priority-5,
    td.ui-table-priority-5 {
        display: table-cell;
    }
}
/* Show priority 6 at 1200 (75em x 16px) */
@media screen and (min-width: 20em) {
    th.ui-table-priority-6,
    td.ui-table-priority-6 {
        display: table-cell;
    }
}
/* Manually hidden */
th.ui-table-cell-hidden,
td.ui-table-cell-hidden {
    display: none;
}
/* Manually shown */
th.ui-table-cell-visible,
td.ui-table-cell-visible {
    display: table-cell;
}


