﻿
.gobutton {
    cursor: pointer; /*forces the cursor to change to a hand when the button is hovered*/
    padding: 5px 25px; /*add some padding to the inside of the button*/
    background: #4cddf3; /*the colour of the button*/
    border: 1px solid #33842a; /*required or the default border for the browser will appear*/ /*give the button curved corners, alter the size as required*/
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px; /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
    color: #f3f3f3;
    font-size: 1.1em;
    /*float: left;*/
}

    .gobutton:hover, .gobutton:focus {
        background-color: #399630; /*make the background a little darker*/ /*reduce the drop shadow size to give a pushed button effect*/
        -webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
        -moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
        box-shadow: 0 0 1px rgba(0,0,0, .75);
    }

body {
    font-family: Arial;
}

#TAGMV {

}
.tag-hide{
  display:none;
}

.underline {
  border-bottom:solid 2px #71A843;
}

.bs-body {
    direction: rtl;
    margin: 20px;
    clear: both;
}

    .bs-body ul {
        float: right;
    }

.mainDivCls {
    width: 500px;
    margin-right: 100px;
    line-height: 25px;
}

.input-section {
    width: 500px;
}

div.column {
    padding: 0px;
    margin: 0px;
    font-weight: bold;
}

label.column {
    /*width: 100px;*/
    padding: 0px;
    margin: 0px;
    font-weight: bold;
    display: block;
}

label.column-sm {
    width: 100px;
    padding: 0px;
    margin: 0px;
}

.label.column-wide {
    width: 200px;
}

input.label {
    border: 0;
    background-color:transparent;
}
input.readonly {
    background-color:transparent;
}
input[readonly], input[readonly="readonly"] {
    background-color:transparent;
}

input.text-wide {
    width: 280px;
}

input.text-short {
    width: 80px;
}

input.noborder {
    border: 0;
}

.mandatory {
    color: red;
}

.input-remark {
    color: red;
    font-weight: normal;
    font-size: 12px;
}

.inlineCombo {
    display: inline-block;
}

.textarea-mid {
    width: 50%;
    height: 60px;
    min-width: 280px;
}

/* toolbar */
nav {
    margin-bottom: 5px;
}

ul.toolbar {
    font-size: 0.8em;
    font-weight: 100;
    margin: 0 0 5px;
    padding: 0;
    text-align: right;
}

    ul.toolbar li {
        display: inline;
        list-style: none;
        padding: 5px 25px;
        text-align: center;
        background-color: #4cddf3;
        border: 1px solid #33842a;
        /*color: #fff;*/
        width: auto;
        -moz-border-radius: 10px;
        -webkit-border-radius: 10px;
        border-radius: 10px; /*give the button a drop shadow*/
        -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
        -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
        box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
    }

        ul.toolbar li:hover {
            display: inline;
            list-style: none;
            background-color: #399630;
            -webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
            -moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
            box-shadow: 0 0 1px rgba(0,0,0, .75);
        }

        ul.toolbar li input {
            background: #ffffff;
            color: #000000;
            text-decoration: none;
        }

        ul.toolbar li a {
            background-color: #4cddf3;
            color: #fff;
            text-decoration: none;
        }

            ul.toolbar li a:hover {
                color: #333;
                text-decoration: none;
            }

/*.toolbar {
        font-size: 0.8em;
        font-weight:100;
        margin: 0 0 5px;
        padding: 0;
        text-align: right;
    }*/

.form-group {
    font-size: 12px;
    line-height: 1.3;
    margin-bottom: 5px;
}

    .form-group.pasive {
        display: none;
    }

    .form-group.active {
        display: block;
    }

.rtl {
    direction: rtl;
}
.align-right {
    text-align: rtl;
}

.mw600 {
    max-width:600px;
}
.box-title {
    direction: rtl;
    /*border-bottom: solid 1px #808080;*/
    border-bottom: solid 2px #71A843;
}

.box-row {
    margin-right: -24px;
    margin-left: -15px;
}

.box-center {
    padding-top: 23px;
    margin-bottom: 16px;
}

    .box-center .col-lg-6 {
        padding-top: 23px;
    }

.box-choose {
    padding-top: 20px;
    padding-bottom: 16px;
}

    .box-choose .col-lg-6 {
        padding-top: 23px;
    }

.media-image {
    margin-bottom: 10px;
}

/*grid extension====================================================*/

.jqx-grid-cell {
      border-top: none!important;
      border-left: none!important;
      border-right: none!important;
 }
.grid-toolbar {
    background-color: #E8E8E8;
    border: solid 1px #C7C7C7;
    width: 100%;
    height: 35px;
    overflow: auto;
}

.grid-wrap {
    padding: 0;
    margin: 0;
}

/*jquery.UI extension====================================================
Primary style
background-color:#4cddf3; myt-light blue 
background-color:#E8E8E8; gray 
color: #C7C7C7; dark gray border
color: #ff6a00; orange
-------------------------------- */
.dialog-header {
    font: normal normal normal 10px/1.5 Arial, Helvetica, sans-serif;
}

.ui-dialog > .ui-widget-header {
    background: #4cddf3;
    color: #fff;
    height: 30px !important;
    font-size: 80% !important;
}

.ui-dialog-osx {
    /*font: normal normal normal 10px/1.5 Arial, Helvetica, sans-serif;*/
    -moz-border-radius: 0 0 8px 8px;
    -webkit-border-radius: 0 0 8px 8px;
    border-radius: 0 0 8px 8px;
    border-width: 0 8px 8px 8px;
}

.ui-accordion-header-active {
    background: #4cddf3 !important;
}

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active {
    background-image: none;
    background: #4cddf3 !important;
    /*color:#fff !important;*/
}

.ui-accordion .ui-accordion-header {
    height: 30px !important;
    font-size: 80% !important;
}

/*tabs*/
#tabs .ui-widget-header {
    background: transparent;
    border: none;
    border-bottom: 1px solid #c0c0c0;
    -moz-border-radius: 0px;
    -webkit-border-radius: 0px;
    border-radius: 0px;
}

#tabs .ui-tabs-nav .ui-state-default {
    float: right;
    background: transparent;
    border: none;
}

#tabs .ui-tabs-nav .ui-state-active {
    /*background: transparent url(img/uiTabsArrow.png) no-repeat bottom center;*/
    border: none;
}

#tabs .ui-tabs-nav .ui-state-default a {
    color: #c0c0c0;
}

#tabs .ui-tabs-nav .ui-state-active a {
    color: #fff !important; /*#32A7C0;*/
}
/*#tabs li a
{
    outline-color: transparent !important;
}*/

#wizard ul {
    display: none !important;
}

    #wizard ul > li {
        display: none !important;
    }

        #wizard ul > li > a {
            display: none !important;
        }

#wizard-steps {
    float: left;
    margin: 10px 5px;
    width: 100%;
}

#wizard-validation {
    float: right;
    margin-right: 5px;
    border: none;
    background: #fff;
    width: 80%;
    color: #ff0000;
}

#wiz-container .wiz-tab {
    display: none;
    position: relative;
}

    #wiz-container .wiz-tab.active {
        display: block;
        position: relative;
    }

div#wiz-loader {
    display: none;
}

    div#wiz-loader.active {
        display: block;
        background: url(images/loading.gif) center center no-repeat;
        width: 100%;
        text-align: center;
        position: absolute;
    }


.btn-tab {
    background: #4cddf3;
    height: 25px;
    /*width: 150px;*/
    padding: 5px 20px;
    border: solid 1px #808080;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px; /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
}


.btn-bar a {
    display: inline;
    list-style: none;
    padding: 5px 25px;
    text-align: center;
    background-color: #6b6dbb;
    border: 1px solid #33842a;
    color: #fff;
    width: auto;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    border-radius: 10px; /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
}

    .btn-bar a:hover {
        display: inline;
        list-style: none;
        background-color: #399630;
        -webkit-box-shadow: 0 0 1px rgba(0,0,0, .75);
        -moz-box-shadow: 0 0 1px rgba(0,0,0, .75);
        box-shadow: 0 0 1px rgba(0,0,0, .75);
    }

/*---------------------------------------------------------------------------------------------------------------------------*/
.container-box {
    direction: rtl;
    margin-left: 10%;
    margin-right: 10%;
}

.panel-window {
    background-color: #fff;
    direction: rtl;
    margin:5px;
    /*max-width:600px;*/
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
}
.panel-header {
    background-color: #E8E8E8;
    border: solid 1px #C7C7C7;
    width: 100%;
    height: 25px;
    overflow: hidden;
    font-weight:bold;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px; /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
}

.panel-page {
    background-color: #fff;
    direction: rtl;
    margin:5px;
    width:100%;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; 
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); 
}
.panel-header-info {
    background-color: #0094ff;
    border: solid 1px #C7C7C7;
    width: 100%;
    height: 20px;
    overflow: hidden;
    font-weight:bold;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px; 
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75);
}
.panel-header-error {
    background-color: #fe9043;
    border: solid 1px #C7C7C7;
    width: 100%;
    height: 20px;
    overflow: hidden;
    font-weight:bold;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px; 
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75);
}


.panel-area-title {
   background-color:#ffffff;
   font-size:120%;
   /*font-weight:bold;*/
   color:#20a1b5;
   -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; /*give the button a drop shadow*/
}

.panel-area {
    background-color: #f3f2f2;
    margin-bottom: 5px;
    padding: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
}

.panel-area-titleB {
    background-color: #20a1b5;
    font-size: 120%;
    /*font-weight:bold;*/
    color: #ffffff;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; /*give the button a drop shadow*/
}

.panel-areaB {
    background-color: #ffffff;
    margin-bottom: 5px;
    padding: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    border-radius: 5px; /*give the button a drop shadow*/
    -webkit-box-shadow: 0 0 4px rgba(0,0,0, .75);
    -moz-box-shadow: 0 0 4px rgba(0,0,0, .75);
    box-shadow: 0 0 4px rgba(0,0,0, .75); /*style the text*/
}


.global-view { /*margin-right:10%;*/
    padding: 0;
    background: #ffffff;
}

.global-rtl {
    direction: rtl;
    padding: 0;
    background: #ffffff;
}

.column-right {
    padding-left: 10px;
    float: right;
    /*width: 50%;*/
    /*display:block;*/
}

.column-left {
    padding-right: 10px;
    float: left;
    /*width: 50%;*/
    /*display:block;*/
}
/* Clear floats after the columns */
.row:after {
    content: "";
    display: table;
    clear: both;
}

/*.columns {
  display: flex;
}*/
.section-111 {
    flex: 1; /*grow*/
    margin: 2px;
    /*border: 1px solid;*/
}

/* STRUCTURE */

/*.wrapper {
	padding: 5px;
	max-width: 960px;
	width: 95%;
	margin: 20px auto;
}*/
/*header {
	padding: 0 15px;
}*/

/*.columns {
	display: flex;
	flex-flow: row wrap;
	justify-content: center;
	margin: 5px 0;
}*/

/*.section-right {
	flex: 1;
	margin: 2px;
	padding: 10px;
	&:first-child { margin-left: 0; }
	&:last-child { margin-right: 0; }
	
}*/

.section-table {
    display: table;
    table-layout: fixed; /*euqal column width*/
    width: 100%;
}

.section-cell {
    display: table-cell;
    padding-left:10px;
}

/*    
@media screen and (max-width: 680px) {
	.columns .section {
		flex-basis: 100%;
		margin: 0 0 5px 0;
	}
}*/

/*---------------------------------------------------------------------------------------------------------------------------*/

@media (max-width: 768px) {
    .section-cell {
        display: block;
    }
}

@media (max-width: 560px) {
    .container-box {
        direction: rtl;
        margin-left: 4px;
        margin-right: 4px;
    }
}
