                                        :root {
  --primary-color: #2a408a;
  --secondary-color: #00adb6;
  --text-color: #333333; 
  --font: 'ROBOTO', Helvetica, Arial, Sans-Serif;   
  --backgroundcolor: #e3e3e7;  
}                                       

body {                         
    font-family: var(--font);
    background-color: var(--backgroundcolor) !important;
}                          


.brandcolor {                         
    background-color: var(--primary-color);
    background-image: none;
    color: white;                                       
    text-shadow: none;        
    font-family: var(--font);      
}

.container .brandcolor {      
    background-color: var(--primary-color);                         
    
}                                               
                                                                    
.brandcolor .navbar-brand, .navbar-nav > li > a {
    text-shadow: none;
    color:white !important;
                           
}
                                                               

h1, .h1,
h2, .h2,
h3, .h3,
h4, .h4,
h5, .h5,
h6, .h6 {
    font-family: var(--font);       
}                                        

.panel-primary > .panel-heading {
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);               
    background-image:  linear-gradient(to bottom, var(--primary-color) 0%, var(--primary-color) 100%);
}

.panel-default > .panel-heading {
    letter-spacing: 0.7px;
    color: var(--text-color);
    font-size: 14px;                                  
}

.panel-info > .panel-heading {
    letter-spacing: 0.7px;
    color: var(--text-color);
    font-size: 18px;
}

.panel-info > .panel-heading {     
    color: #fff;
    background-color: var(--primary-color);
    border-color: var(--primary-color);               
    background-image:  linear-gradient(to bottom, var(--primary-color) 0%, var(--primary-color) 100%);
}

.panel-primary > .panel-heading {
    letter-spacing: 0.7px;
    font-size: 18px;
}

.flat span:hover, .flat span.active,
.flat span:hover:after, .flat span.active:after{
    background: var(--secondary-color);
    color:black;
}                        

.flat a:hover, .flat a.active,
.flat a:hover:after, .flat a.active:after{
    background: var(--secondary-color);;
    color:black;
}


.btn-primary:hover, .btn-primary:focus {
    all:unset; 
    padding: 6px 12px; 
    border-radius: 4px;
    line-height: 1.42857143;
    font-height: 400;
    cursor: pointer;
    display:inline-block;
    background-color: var(--secondary-color);
    background-position: 0 -15px;
    background-image:  none;
    color: var(--textcolor);
    border-color: var(--primary-color);
    
}
                    
.btn-primary {                 
    all:unset;
    line-height: 1.42857143;
    padding: 6px 12px; 
    border-radius: 4px;
    cursor: pointer;
    font-height: 400;
    display:inline-block;

    background-color: var(--secondary-color);
    background-position: 0 -15px;   
    color: var(--textcolor);                       
    border-color: var(--secondary-color);
}




.modal-header, h5, .close {
    background-image:  linear-gradient(to bottom, var(--primary-color) 0%, var(--primary-color) 100%);
    color: white !important;
    text-align: center;
    font-size: 30px;
}

.dx-widget {
    font-family: var(--font);
}

.dropdown-menu > .active > a, .dropdown-menu > .active > a:hover, .dropdown-menu > .active > a:focus {
    
background-repeat: repeat-x;
background-color: var(--primary-color);
}

.form-group {
    margin-bottom: 7px;
}


.container.drop-shadow {
    padding-left:0;
    padding-right:0;
    margin-top:-1rem;
}

.navbar {   
    margin-bottom: 0px;    
}

.articleshort {
    font-size: 18px;
}                       
                                                         
.articlelong {
    font-size: 14px;
}

          
.navbar-nav > li > a {
  padding-top: 14px;    
  padding-bottom: 10px;
  line-height: 40px;
}                        

.navbar-brand {
    line-height: 40px;
    font-size: 14px;
}          

.navbar {
  margin-bottom: -1rem;
}
