/*---------------------
General
---------------------*/
a						{font-weight:normal; color:#333; text-decoration:underline;}
a:hover					{text-decoration:none;}

h1, h2, h3				{font:bold 14px nimbus-sans, Arial, Sans-serif; color:#000;}
h1						{font-size:48px; margin:0 0 10px 0;}
h2						{font-size:32px; margin:25px 0 5px 0;}
h3						{font-size:22px; margin:25px 0 5px 0;}
h4						{margin:25px 0 5px 0; font-weight:bold; line-height:1.5;}
p						{margin:0 0 10px 0;}

::selection             {background:#d0e8ff;}
::-moz-selection        {background:#d0e8ff;}


img, table				{border:0;}
html 					{margin:0; padding:0;}
body { margin: 0; padding: 0; COLOR: #000; font-size: 16px; font-family: nimbus-sans, Arial, Verdana, "Lucida Sans", "Lucida Grande", Sans-serif; line-height: 1.5; font-weight:100;}

.blueLinkBtn { background:#00386A; font-size: 16px; padding: 12px 25px; color:#fff; display:inline-block; margin: 15px 0 0 0; text-decoration:none; border-radius:100px;}
.blueLinkBtn:hover { background: #004481; }
.grayBtn { background: #F0F0F0; color:#000; border-radius:50px; font-size: 16px; padding: 12px 20px; cursor:pointer; display:inline-block; margin: 15px 0 0 0;}
    .grayBtn:hover { background: #B9B9B9; }
.icon { color: #000; font-size: 16px; cursor: pointer; margin: 0 5px; display:inline-block;}
.icon i, .icon em {}
.icon em {}

table.collapsable { width: 100%; max-width: 800px;}
    table.collapsable img { max-width: 100%; }
    table.collapsable td {padding: 0 !important; margin: 0;}
    table.collapsable h2 {margin: 0 0 5px 0;}

.breadcrumbs {background:#00386A; }
.breadcrumbsInner {max-width:1215px; margin: auto; padding: 17px 0;}
.breadcrumbs a,
.breadcrumbs span { font-weight: lighter; font-size: 14px; text-decoration: none; color: #fff; display: inline-block; margin: 0 3px 0 0; }
    .breadcrumbs a i,
    .breadcrumbs span i{ margin: 0 0 0 5px; display: inline-block; }
/*---------------------
Body layout
---------------------*/
#wrapper { margin: 0 auto; }
.inner                      {max-width: 1215px; margin:0 auto;}
.inner.big {}

#logo                       {height: 22px;}
#logo img                   {display:block; height: 100%;}

.header { background-color: #fff; padding: 24.5px 0 0 0; position:sticky; top: 0; z-index:1000; }
    .header .inner { margin: auto; display: flex; justify-content: space-between; align-items: center; }
    .header .searchTypeRbList {display:inline-flex; justify-content:flex-start; align-items:center;}
    .header .searchTypeRbList input { margin: 0 3px; }

    .headerRight { display: flex; justify-content: space-between; align-items: center; }

.searchDiv { background: #fff; border: 1px solid #B9B9B9; box-sizing:border-box; border-radius:100px; padding: 10px 14px; display:flex; justify-content:center; align-items:center; box-sizing:border-box; position:relative;}
.searchDiv.active {border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-left-radius: 0; border-bottom-right-radius: 0;}
.searchDiv input[type=text] {font-size:16px; border:none; margin:0; padding:0; width: 340px; outline:none;}
.searchDiv a {display:inline; height:17px; width: 17px;}
.searchDiv a img {display:block;}

.searchType {font-size:14px; margin: 5px 0 0 5px; display:flex; justify-content:flex-start; align-items:center;}

.searchDiv #searchResults { position: absolute; top: 38px; left: -1px; width: 100%; background: #fff; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; }
    #searchResults ul { list-style: none; padding: 0; margin: 0; width: 100%; }
.searchDiv #searchResults ul { border: 1px solid #B9B9B9; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; }
        #searchResults ul li { border-bottom: 1px solid #b9b9b9; padding: 10px; }
        #searchResults ul li:last-child { border-bottom: none; }
            #searchResults ul li:hover { background: #70707020; }
        #searchResults ul li p {margin:0;}
        #searchResults ul li a {text-decoration:none; font-weight: bold; display:block; width:100%; height:auto;}
            #searchResults ul li.allSearchResults { background: #00386A; padding: 25px 0px; border-bottom-right-radius:20px; border-bottom-left-radius: 20px; }
                #searchResults ul li.allSearchResults:hover { background: #004481; }
                #searchResults ul li.allSearchResults a { color: #fff; font-size: 16px; font-weight: bold; line-height: 1em; text-align: center; display: flex; justify-content: center; align-items: center; }
                    #searchResults ul li.allSearchResults a img { margin: 0 0 0 20px; transform: rotate(180deg); }


.topmenu { overflow: hidden; }
.header #responsive-menu-btn  {display:none;}

.topmenu ul                  {margin:0; padding:0;}
.topmenu ul li               {display:inline-block; }
.topmenu ul li a             {font-size: 16px; color: #000; font-weight:lighter; text-decoration: none; padding: 0px 10px; display: block;}
.topmenu ul li.on a          { }
.topmenu ul li a:hover       {text-decoration:none;}
.topmenu ul li a.haschild    {display:none;}
.topmenu ul li ul            {display:none;}

.header #nav ul#responsive            {display:none;}
.header .contactPuffs {
    position: absolute;
    right: 0;
}
.header .lang { display: flex; justify-content:center; align-items:center; gap: 8px; position: relative; margin: 0px 0 0 10px; color: #000; cursor: pointer; font-size: 16px; font-weight: lighter; border: 1px solid #B9B9B9; border-radius:100px; padding: 15px; line-height: 1em; background:#fff; }
.header .lang.on {border-top-left-radius: 25px; border-top-right-radius: 25px; border-bottom-left-radius: 0; border-bottom-right-radius:0; border-bottom:none;}   
.header .lang i { margin: 0 0 2px 5px; }

    .header .lang .selection { width: 98px; background-color: #fff; position: absolute; top: 48px; left: -1px; padding: 0; margin: 0; list-style: none; display: none; z-index: 5; border: 1px solid #B9B9B9;}
    .header .lang.on .selection { border-bottom-left-radius: 25px; border-bottom-right-radius: 25px;}
    .header .lang.on .selection { display: block; }
    .header .lang .selection li { width: 100%; padding: 5px 0; margin: 0; border-bottom: 1px solid #B9B9B9; }
        .header .lang .selection li:last-child { border-bottom-left-radius: 25px; border-bottom-right-radius: 25px; }
    .header .lang .selection li:hover { background: #B9B9B9; }
        .header .lang .selection li:last-child { border: 0; }
        .header .lang .selection li a { color: #000; display: block; width: 100%; height: 100%; text-decoration: none; text-align: center; }

/*---------------------
Page layout
---------------------*/
.clearfix:after 			{content:"."; display:block; height:0; clear:both; visibility:hidden;}
* html .clearfix 			{height: 1%;}

.content					{ background-color:#fff; position:relative; }
.content .inner             {min-height:450px; overflow:hidden; padding:40px 0;}
.contentcenter   			{width:100%; margin:0; padding:0; overflow:hidden;}
.contentcenter.small        {max-width: 1000px; margin: auto;}
    .contentcenter.big { max-width: 1460px; }
    .contentcenter.verysmall { max-width: 750px; margin: auto; }

.productColumns { display: flex; justify-content: flex-start; gap: 6%; align-items: flex-start; }
    .productColumns .leftColumn { width: 24%; }
    .productColumns .rightColumn { width: 70%; }
/*---------------------
Submenu vertical
---------------------*/ 
.leftmenu                           {float:left; width:25%;}
.leftmenu ul					    {width:90%; margin:0; padding:0 0 10px 0; list-style:none; overflow:hidden;}
.leftmenu ul li				        {width:100%; margin:0; padding:0; border-bottom:1px dotted #999;}
.leftmenu ul li:last-child          {background:none; border:0;}
.leftmenu ul li a				    {width:100%; margin:0; padding:0; font:normal 12px/40px Arial; color:#555; text-decoration:none; display:block;}
.leftmenu ul li a:hover             {color:#333;}
.leftmenu ul li.on a			    {color:#333; font-weight:bold;}
.leftmenu ul li.on-childs           {background:none; border:0;}
.leftmenu ul li.on-childs a	        {color:#555; font-weight:bold; line-height:30px;}

.leftmenu ul li.on-childs ul            {margin:0 0 0 15px !important;}
.leftmenu ul li.on-childs ul li         {background:none; border:0;}
.leftmenu ul li.on-childs ul li a       {font-weight:normal !important; line-height:24px !important; font-size:11px; color:#555;}
.leftmenu ul li.on-childs ul li a:hover {color:#333;}
.leftmenu ul li.on-childs ul li.on a    {color:#333; font-weight:bold !important;}

/*---------------------
Submenu horizontal
---------------------*/ 
.fullmenu                           {background-color:#cccccc;}
.fullmenu ul					    {width:auto; text-align:center; margin:0; padding:0; list-style:none; overflow:hidden;}
.fullmenu ul li				        {display:inline-block; margin:0 10px; padding:0; }
.fullmenu ul li:last-child          {background:none; border:0;}
.fullmenu ul li a				    {margin:0; padding:5px 10px; font:normal 12px/40px Arial; color:#555; text-decoration:none; display:block;}
.fullmenu ul li a:hover             {color:#333;}
.fullmenu ul li.on a, .fullmenu ul li.on-childs a			    {color:#333; font-weight:bold;}


/*---------------------
Footer layout
---------------------*/
.footer { background: #F8F8FA; padding: 95px 0 55px 0; }
.footer.white {background:#fff;}
.footer .inner {display:flex; justify-content:space-between; align-items:center;}
.footer .footerDiv {display:flex; width:100%; justify-content:space-between; align-items:center;}
    .footer p { color: #302F2F; font-size: 16px; line-height: 1.5em; font-weight:lighter; }
    .footer .icon {margin: 0 5px 0 0;}
    .footer .links a {color:#000; text-decoration:none;}
        .footer .links a::before { content: '> '; }
    .footer a:hover { text-decoration: underline; }

    .footer .links .icon {font-size: 24px;}
    .footer .links .icon::before { content: ''; }
    .footer .prodLink { font-size: 14px; color:#000; margin: 120px auto 0 auto; display:block; max-width:1215px;  text-align:right; }
        .footer .prodLink a { text-decoration: none; }
        .footer .prodLink a:hover { text-decoration: underline; }


@media screen and (max-width: 1215px) {
    .inner {padding: 0 15px; box-sizing:border-box;}
    .breadcrumbsInner { padding: 10px 15px; }
    .content .inner { padding: 40px 15px; }
    .topmenu { display: none; }
    .header { padding: 15px 0; border-bottom: 1px solid #B9B9B9; }
        .header #responsive-menu-btn { display: block; font-size: 26px; margin: 0 0 0 20px; }
        .header .lang { padding: 5px; }
            .header .lang .selection { top: 28px; width: 78px; }
            .header .lang.on { border-top-left-radius: 15px; border-top-right-radius: 15px; }
                .header .lang.on .selection { border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; }
            .header .lang .selection li:last-child { border-bottom-left-radius: 15px; border-bottom-right-radius: 15px; }
    .blueLinkBtn { font-size: 16px; padding: 10px 15px; margin: 10px 0 0 0; }

}

    @media screen and (max-width: 1100px) {
        .searchDiv input[type=text] { width: 280px; }

        .productColumns { display: block; }
            .productColumns .leftColumn { display:none;}
            .productColumns .rightColumn { width: 100%; }
    }

    @media screen and (max-width: 860px) {
        h1 { font-size: 36px; }
        h2 { font-size: 26px; }
        h3 { font-size: 18px; }
        body { font-size: 16px; }

        .header { }
            .header .inner { height: auto; z-index: 999; }
        .searchDiv input[type=text]{width: 150px;}

        .header #nav { position: static; top: 0; left: 0; height: auto; min-height: 50px; width: 100%; padding: 0; margin: 0; z-index: 9; display: none; }
        .header .topmenu { display: none; }


        .content .topGfx img { height: 120px; }

        .content { width: auto; height: auto; min-height: 100px; margin: 0; padding: 0; }
        .submenu { display: none; }

        .contentright { float: none; width: 100%; }

        .footer { padding: 45px 0 25px 0; }
            .footer .prodLink {margin: 40px auto 0 auto; padding: 0 20px; text-align:left;}
            .footer .footerDiv { flex-wrap: wrap; gap: 20px 4%; align-items:flex-start;}
            .footer .footerDiv p,
            .footer .footerDiv div {width: 48%; max-width:none !important; text-align:left !important; }
            table.responsive-table,
            table.responsive-table thead,
            table.responsive-table tbody,
            table.responsive-table th,
            table.responsive-table td,
            table.responsive-table tr { display: block; border: 0; }
            table.responsive-table thead tr { position: absolute; top: -9999px; left: -9999px; }
            table.responsive-table tr { border: 1px solid #ccc; }
            table.responsive-table td { padding: 4px 6px; }
            table.responsive-table td { border: none; border-bottom: 1px solid #ddd; position: relative; padding-left: 50%; white-space: normal; text-align: left !important; }
                table.responsive-table td:before { position: absolute; top: 6px; left: 6px; width: 45%; padding-right: 10px; white-space: nowrap; text-align: left; font-weight: bold; }
                table.responsive-table td:before { content: attr(data-title); }
    }

    @media only screen and (max-width: 680px) {
        table.collapsable,
        table.collapsable tr,
        table.collapsable thead,
        table.collapsable tbody,
        table.collapsable tfoot,
        table.collapsable td { display: block; width: 100%; margin: auto; }
        .start-news .newsItem .image { height: 200px; }
    }

    @media screen and (max-width: 600px) {
        h1 { font-size: 28px; }
        h2 { font-size: 22px; }

        .header { height:140px; box-sizing:border-box; }
        .header .inner {position:relative; justify-content:center; }
            .header #responsive-menu-btn {position:absolute; right:10px; }
            .header .lang {position:absolute; left:0;}
            .searchWrapper { position: absolute; top: 50px; left: 0px; width: 96%; padding: 5px 10px; }
        .header .inner .searchWrapper .searchType {font-size:12px !important;}
        .searchDiv input[type=text] { width: 100%; font-size: 14px; }
        .footer .footerDiv p,
        .footer .footerDiv div { width: 100%; }
        .breadcrumbs a, .breadcrumbs span {font-size:12px;}

        .content .inner {padding: 20px 15px;}
        .grayBtn {font-size:14px;}
    }

    @media screen and (max-width: 480px) {
        body { font-size: 16px; }
        .header .selectedLang {display:none;}
        .header .lang .selection {width:50px;}
        .header .inner .searchWrapper p.searchType { font-size: 12px !important; }
        .resellers p { font-size: 14px; }

        .breadcrumbs { font-size: 12px; }

        .header .lang { font-size: 14px; }
        .start-top { height: 400px; }
    }