/*----------------------------------------------------------
The base color for this template is #5c87b2. If you'd like
to use a different color start by replacing all instances of
#5c87b2 with your new color.
----------------------------------------------------------*/
html, body { margin:0; padding:0; height:100%; font: 11px Tahoma, Arial, Geneva, sans-serif; }
body { background:#fff url(https://www.nortonline.com.gr/nortonline/site/template/body_bg.jpg) repeat-y center top; color:#7A7A7A; }

img { border:0; }

a { color:#7A7A7A; text-decoration:none; }
a:hover { text-decoration:underline; }

p, ul { margin-bottom: 20px; line-height: 1.6em; }

header, footer, nav, section { display: block; }

/* PRIMARY LAYOUT ELEMENTS   
----------------------------------------------------------*/

/* you can specify a greater or lesser percentage for the 
page width. Or, you can specify an exact pixel width. */
.container { width:999px; margin-left: auto; margin-right: auto; }
.body { min-height:100%; position:relative; }





/* FORM LAYOUT ELEMENTS   
----------------------------------------------------------*/

fieldset {
    border: 1px solid #ddd;
}

legend {
    font-size: 1.2em;
    font-weight: bold;
    color:#7A7A7A;
}

textarea {
    min-height: 75px;
}

input[type="text"], 
input[type="password"] {
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
    width: 200px;
}

select {
    border: 1px solid #ccc;
    padding: 2px;
    font-size: 1.2em;
    color: #444;
}

input[type="submit"] {
    font-size: 1.2em;
    padding: 5px;
}

/* TABLE
----------------------------------------------------------*/
.grid table { border: solid 1px #e8eef4; border-collapse: collapse; width:100%; }
.grid table td { padding: 5px; border: solid 1px #e8eef4; }
.grid table tr:nth-child(2n) td { background-color:#F0F0F0; }
.grid table tr:hover td { background-color:#1A4C8C; color:#FFFFFF; }
.grid table tr:hover td a { color:#FFFFFF; }
.grid table th { padding: 6px 5px; text-align: left; background-color: #e8eef4; border: solid 1px #e8eef4; }

/* MISC  
----------------------------------------------------------*/
.clear {
    clear: both;
}

.error {
    color: Red;
}

#menucontainer {
    margin-top: 40px;
}

/* Styles for validation helpers
-----------------------------------------------------------*/
.field-validation-error {
    color: #ff0000;
}

.field-validation-valid {
    display: none;
}

.input-validation-error {
    border: 1px solid #ff0000;
    background-color: #ffeeee;
}

.validation-summary-errors {
    font-weight: bold;
    color: #ff0000;
}

.validation-summary-valid {
    display: none;
}

/* Styles for editor and display helpers
----------------------------------------------------------*/
.display-label, 
.editor-label {
    margin: 1em 0 0 0;
}

.display-field, 
.editor-field {
    margin: 0.5em 0 0 0;
}

.text-box {
    width: 30em;
}

.text-box.multi-line {
    height: 6.5em;
}

.tri-state {
    width: 6em;
}


/* Custom */
* { outline:none; }

/* clearfix */
.clearfix:after { visibility:hidden; display:block; font-size:0; content:" "; clear:both; height:0; }
* html .clearfix { zoom:1; } /* IE6 */
*:first-child+html .clearfix { zoom:1; } /* IE7 */

/*
.cc .box { float:left; width:283px; margin:0 10px 22px 0; padding:10px; background-color:#EDEDED; border-radius:20px 0 20px 0; }
.cc .box:nth-child(3) { margin-right:0; }
.cc .box ul { margin:0; padding:5px 0 0 15px; }
.cc .box ul li { list-style:none; }
*/

/* css for timepicker */
.ui-timepicker-div .ui-widget-header { margin-bottom: 8px; }
.ui-timepicker-div dl { text-align: left; }
.ui-timepicker-div dl dt { height: 25px; margin-bottom: -25px; }
.ui-timepicker-div dl dd { margin: 0 10px 10px 65px; }
.ui-timepicker-div td { font-size: 90%; }
.ui-tpicker-grid-label { background: none; border: none; margin: 0; padding: 0; }

/* from site */
.left { float:left; }
.right { float:right; }
.logo-row { background:url(https://www.nortonline.com.gr/nortonline/site/template/logo_bg.jpg) no-repeat scroll right top transparent; height:140px; padding-left:30px; }

.orange-line { background-color:#E9692A; height:19px; padding:3px 5px 0 5px; text-align:right; }
.orange-line, .orange-line a { color:#FFFFFF; }

.menu-row { width:100%; border-top:none; background:url(https://www.nortonline.com.gr/nortonline/site/template/menu_bg.jpg) repeat-x; border-collapse:collapse; border-spacing:0; }
.menu-row td { height:41px; text-align:center; background:url(https://www.nortonline.com.gr/nortonline/site/template/menu_separator.jpg) no-repeat top right; }
.menu-row td:last-child { background-image:none !important; }
.menu-row a { color:#E1E9F5; font-weight:bold; display:block; height:26px; padding-top:15px; }
.menu-row a:hover, .menu-row a.selected { background:url(https://www.nortonline.com.gr/nortonline/site/template/menu_over.jpg) repeat-x; text-decoration:none; color:#5E5E5E; }

.main { padding-bottom:150px; }

footer { position:absolute; bottom:0; display:block; width:100%; z-index:1000; height:131px; }
.footer-row { background:url(https://www.nortonline.com.gr/nortonline/site/template/footer_bg.jpg) no-repeat; height:104px; position:relative; padding-top:5px; }
.footer-row ul { width:570px; list-style-image:url(footer_bullet.gif); }
.footer-row ul li { float:left; width:190px; line-height:20px; color:#FFFFFF; }
.footer-row ul li a { color:#FFFFFF; }

.ui-tabs-nav a { font-size:11px; padding-left:9px!important; padding-right:9px!important; }

.tabpane .gap { margin-bottom:30px; }
.tabpane ul li { list-style:none; float:left; width: 346px; margin-bottom:10px; }
.tabpane ul { margin:0; padding:5px 0 0 0; }


/* menu */

.mask-roundedCorners {
    border-bottom-right-radius: 15px;
    border-bottom-left-radius: 15px;
    overflow: hidden;
}

.module-want {
    height: 36px;
    width: 100%;
    border-collapse:collapse; 
    border-spacing:0;
    
    /* IE10 */ 
    background-image: -ms-linear-gradient(top, #9D9D9D 0%, #757575 100%);

    /* Mozilla Firefox */ 
    background-image: -moz-linear-gradient(top, #9D9D9D 0%, #757575 100%);

    /* Opera */ 
    background-image: -o-linear-gradient(top, #9D9D9D 0%, #757575 100%);

    /* Webkit (Safari/Chrome 10) */ 
    background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #9D9D9D), color-stop(1, #757575));

    /* Webkit (Chrome 11+) */ 
    background-image: -webkit-linear-gradient(top, #9D9D9D 0%, #757575 100%);
    
    /* MSIE 5.5x*/
    filter: progid:DXImageTransform.Microsoft.Gradient(
                StartColorStr='#9D9D9D', EndColorStr='#757575', GradientType=0);

    /* Proposed W3C Markup */ 
    background-image: linear-gradient(top, #9D9D9D 0%, #757575 100%);
}

.module-want td {
    font-weight: bold;
    text-align: center;
    padding: 0px;
}

.module-want a {
    color: #FFFFFF;
}

/* right cell */
.module-want .mwrc {
    border-left-width: 1px;
    border-left-style: solid;
}

/* left cell */
.module-want .mwlc {
    border-right-width: 1px;
    border-right-style: solid;   
}

/* middle cells */
.module-want .mwmc {
    border-right-width: 1px;
    border-left-width: 1px;
    border-right-style: solid;
    border-left-style: solid;
}

.text-intend {
    padding:0% 2% 0% 2%;
}

.header-intend {
    padding:0% 1% 0% 1%;
}

.scrollable-table {
    max-height: 400px; /* Adjust the height as needed */
    overflow-y: auto;
    position: relative;
}

.scrollable-table thead th {
    position: sticky;
    top: 0;
    background: white; /* Adjust the background color as needed */
    z-index: 1;
}


.editor-container {
    display: flex;
    align-items: center;
}

.editor-group {
    align-items: center;
    padding-left: 10px; /* Adjust padding as needed */
    padding-bottom: 10px;
}

.underline-link {
    text-decoration: underline;
}

.display-label{
    font-weight: bold;
}

.pagination {
    padding-top: 15px;
    display: flex;
    justify-content: center;

}

.pagination a {
    display: inline-block;
    color: black;
    padding: 8px 10px;
    text-decoration: none;
}

.pagination a.active {
    background-color: grey;
    color: white;
    border-radius: 5px;
}

.pagination a:hover:not(.active) {
    background-color: #ddd;
    border-radius: 5px;
}