
/*---------------------
General
---------------------*/
a						{font-weight:normal; color:#333; text-decoration:underline;}
a:hover					{text-decoration:none;}

h1, h2, h3				{font:bold 14px Arial, Sans-serif; color:#000;}
h1						{ font-size: 42px; margin: 0 0 25px 0; font-weight: bold; }
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 20px 0; }

::selection             {background:#d0e8ff;}
::-moz-selection        {background:#d0e8ff;}

table,
table tr,
table tr td				{font:normal 12px/1.5 Arial, Verdana, Sans-serif;}

img, table				{border:0;}
html 					{margin:0; padding:0;}
body { margin: 0; padding: 0; COLOR: #000; font-size: 18px; font-family: Arial, Verdana, "Lucida Sans", "Lucida Grande", Sans-serif; line-height: 1.5; background-color: #fff;}

.redlink { background: #E3001A; color:#fff; text-decoration:none; padding: 15px 25px; display:inline-block; font-size: 18px; }
	.redlink:hover { background: #d10018; }
.blacklink { background: #000; color: #fff; text-decoration: none; padding: 15px 25px; display: inline-block; font-size: 18px; border-radius: 5px; }
	.blacklink:hover { background: #1a1a1a; }
/*---------------------
Body layout
---------------------*/
#wrapper 					{margin:0 auto;}
.inner                      {max-width: 1347px; margin:0 auto; padding: 0 20px; box-sizing:border-box;}

#logo                       {height: 100px;}
#logo img                   {display:block; height: 100%;}

.header 						{padding: 20px 40px; display:flex; justify-content:space-between; align-items:center;}

.header #contact				{position:absolute; right:20px; top:10px;}

	.header .loginBox {text-align:right;margin: 0 0 10px 0;}
	.header input[type=text],
	.header input[type=password]{ background: #F3F3F3; color: #000000; font-size: 15px; border: none; padding: 11px 13.5px; width: 155px; }
	.header input[type=submit] {background:#000; color:#fff; font-size: 15px; border:none; padding: 11px 22px; cursor:pointer;}
.restorePasswordLink {display:block; font-size: 12px; margin: 10px 0 0 0;}
.header .loginIcon {display:none;}

.header #responsive-menu-btn { display: none; }
.topmenu { overflow: hidden; }
.topmenu ul                  {margin:0; padding:0;}
.topmenu ul li               {display:inline-block; margin: 0 0 0 40px;}
.topmenu ul li a             {font-weight: 700; font-size: 18px; color: #000; text-decoration: none; padding: 10px 0px; display: block;}
	.topmenu ul li.on a { color: #e3001a; }
.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;
}
/*---------------------
Page layout
---------------------*/
.clearfix:after 			{content:"."; display:block; height:0; clear:both; visibility:hidden;}
* html .clearfix 			{height: 1%;}

.topHeader { background: #19171B; position:relative; z-index: 1;}
.topHeader .inner {min-height:0 !important; padding: 100px 20px !important; position:relative; overflow:visible !important; box-sizing:border-box;}
.topHeader h1 {color:#fff; margin: 0; font-size: 38px; width: 500px;}

.content { background-color: #F1F1F1; }
.content .inner             {min-height:450px;  padding:40px 20px;}
.contentrightfull { width: 100%; margin: 0 auto; padding: 40px 0px; float: none; position: relative; }
.contentright { width: 75%; margin: 0 auto; padding: 0px 0px 40px 0; float: right; position: relative; }

.contentsmall				{max-width: 1000px; width: 100%; margin: auto; padding: 0; float:none; overflow:hidden;}

/*---------------------
Start page
---------------------*/
#start-slideshow            {width:100%; margin:0 auto;}
.flexslider                 {overflow:hidden; width:100%; margin:0 auto !important;}
.flexslider .slides li      {background-size:cover; background-position:center;}
.flexslider .slides li a    {display:block; height:100%; width:100%;}

#start-content                      {margin:0 auto;}

.start-text { background: #e3001a; }
.start-text .inner {min-height:0; color: #fff; font-size: 18px; font-style: italic; text-align:center;}
.start-text h1 {color:#fff;}

.membership { background: #DCDCDC; }
.membership .inner {display:flex; justify-content:center; align-items:center; min-height:0; padding: 0; background:url(/gfx/circles.svg) left center no-repeat;}
	.membership .text { width: 600px; }
	.membership .text h2 { font-size: 34px;  margin: 0 0 20px 0; }
	.membership .image img {display:block;}
/*---------------------
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 { padding: 80px 0; position: relative; font-size: 14px; line-height: 20px; color: #515151; }
#footer .inner          {display:flex; justify-content:space-between; }
#footer .footerColumn:first-child {width: 40%;}
#footer h3 {font-size: 16px; margin: 0 0 20px 0;}
#footer a { font-weight: normal; color: #E3001A; text-decoration: none; }
#footer a:hover         {text-decoration:underline;}
#footer a.prodLink {color:#515151;}

@media screen and (max-width: 1100px)
{
    h1  {font-size:36px;}
    h2  {font-size:28px;}
    h3  {font-size:22px;}
    
    .header 						        {width:auto; height:auto; height:70px; margin:0; padding:0; position:relative;}
    .header .inner                        {height:auto; z-index:999;}
    #logo                               {position:absolute; left:10px; top:10px;}
    #logo img                           {height:45px; max-height: 100%;}
    
    .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;}

	.header #responsive-menu-btn { position: absolute; right: 0; top: 13px; display: block; height: 50px; padding: 0 14px; z-index: 999; color: #E3001A; font-size: 30px; font-weight: bold; text-transform: uppercase; line-height: 50px; text-decoration: none; cursor: pointer; }
	.header .loginBox { position:absolute; right: 70px; top: 10px; }
	.header input[type=text],
	.header input[type=password] { background: #F3F3F3; color: #000000; font-size: 15px; border: none; padding: 5px 10px; width: 155px; }
	.header input[type=submit]{ background: #000; color: #fff; font-size: 15px; border: none; padding: 5px 15px; cursor: pointer; }
	.restorePasswordLink { margin: 5px 0 0 0; }


	.topHeader .inner { padding: 60px 20px !important; }
	.topHeader h1 { color: #fff; margin: 0; font-size: 36px; width: 100%; text-align:center; }

    .content					{width:auto; height:auto; min-height:100px; margin:0; padding:0;}
    .content .inner             {min-height:100px; padding-bottom:2%;}
	.contentright { max-width: 95%; }

    .submenu				    {display:block; float:none; width: 95%; margin: auto;}
	.leftmenu ul li {display:inline-block; background:#000; color:#fff; width: auto; margin: 0 15px 0 0; }
	.leftmenu ul li:last-child {background: #000; margin: 0; }
	.leftmenu ul li a {color:#fff; padding: 10px; box-sizing:border-box;}

		.leftmenu ul li.on a { color: #fff; }
		.leftmenu ul li:hover,
		.leftmenu ul li.on { background: #232323; }
			.leftmenu ul li:hover a {color:#fff;}

	.content .inner { width: auto; height: auto; margin: 0; padding: 10px; }
    .contentright               {float:none; width:100%;}

    #footer					    {}
    #footer .links              {display:none;}
    
    .flexslider .slides  li     {height:400px !important; line-height: 400px !important;}

	.start-text .inner { font-size: 15px;}
	.membership .inner { justify-content: space-between; }
	.membership .text { width: auto; }

    
	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 screen and (max-width: 700px) {
	.redlink,
	.blacklink { padding: 10px 15px; font-size: 16px; }
	.header {  }

	.header .loginBox { display:none; }
		.header .loginIcon { display: block; position:absolute; top: 13px; right: 55px; font-size: 32px;}

	.membership {padding: 30px 0;}
	.membership .text { text-align:center;}
		.membership .text h2 { font-size: 24px; text-align:center; margin: 0 0 20px 0; }
	.membership .image {display:none;}

	#footer {padding: 20px 0;}
	#footer .inner { display: block; justify-content: space-between; text-align:center; }
	#footer .footerColumn:first-child { width: 100%; }
	#footer h3 { margin: 20px 0 0px 0; }

}

	@media screen and (max-width: 600px) {
		h1 { font-size: 30px; }
		h2 { font-size: 22px; }
		h3 { font-size: 18px; }
		.topHeader h1 { font-size: 30px;}

		#start-puffs { width: 100%; }
			#start-puffs .puffitem .rub,
			#start-puffs .puffitem a .rub { font-size: 12px; }
			#start-puffs .puffitem .content p,
			#start-puffs .puffitem a .content p { line-height: 14px; font-size: 11px; }
			#start-puffs .puffitem .image,
			#start-puffs .puffitem a .image { height: 120px; }

		#start-news { width: 100%; margin-top: 2%; }
			#start-news h3 { padding: 0 0 1.5% 0; }
			#start-news ul li { margin: 0 0 1.5% 0; }
				#start-news ul li a { background-color: #f7f7f7; padding: 1.2% 1.2% 1.2% 2%; }
	}

	@media screen and (max-width: 480px) {
		h1 { font-size: 26px; }
		h2 { font-size: 20px; }
		h3 { font-size: 16px; }
		.topHeader .inner { padding: 30px 20px !important; }

		.topHeader h1 { font-size: 26px; }
		.header input[type=text],
		.header input[type=password] { font-size: 12px; padding: 2.5px; }
		.header input[type=submit] { font-size: 12px; padding: 2.5px 5px; }


	}
