@font-face { font-family: 'Mulish';
             src: url("../../css/Mulish.ttf") format("truetype"); }
			 
@font-face { font-family: 'Arimo-Bold';
             src: url("../../css/Arimo-Bold.ttf") format("truetype"); }
			 
			 
@font-face { font-family: 'Montserrat';
              src: url("../../css/Montserrat.ttf") format("truetype"); }	

@font-face { font-family: 'Open Sans';
              src: url("../../css/OpenSans.ttf") format("truetype"); }			  

body { margin: 0;
       padding: 0;
       overflow-x: hidden;
	   color: #333;
       font: normal 15px 'Open Sans', serif }
	
h1 { font: normal 21px 'Arimo-Bold', sans-serif;
	 color: #333;
     margin: 20px 0 25px 0 }
	 
img { border: 0 }
 
table { border: 0; border-spacing: 0; border-collapse: collapse }

.head_block { height: 178px;
              width: 100%;
			  margin-top: 15px; 
			  margin-bottom: 30px; 
			  display: flex;
              align-items: center;
              padding-left: 15px;
              color: #eee;
			  box-sizing: border-box;
              font: normal 22px 'Arimo-Bold', sans-serif }
			  
.about_content { width: 100%;
                 margin-top: -10px;
                 display: flex;
                 flex-direction: row;
                 flex-wrap: wrap;
                 align-items: center;
                 align-content: flex-start;
                 justify-content: space-around;
                 box-sizing: border-box }
	
  .about_content article { width: 320px;
				 		   margin-top: 30px;
		  				   border-radius: 11px;
						   background-color: #EDF8F8;
						   text-align: center;
						   padding: 20px;
		                   font: bold 16px 'Open Sans', sans-serif;
						   color: #222;
                           box-sizing: border-box }
								
    .about_content article img { margin-right: 15px; width: 40px; vertical-align: middle }					  


.content { margin-top: 30px; 
           width: 100%;
           padding: 0 15px;
		   box-sizing: border-box }

  .content h2 { font: normal 18px 'Montserrat', sans-serif;
	            color: #222;
                margin: 40px 0 0 0 }	

  .content p { margin: 15px 0 15px 0; 
               line-height: 1.5 }
			 
  .content li { margin-left: -15px; 
                line-height: 1.5 }
				
  .content aside { width: 100%;
                   display: flex;
                   flex-direction: row;
                   flex-wrap: wrap;
                   align-items: center;
                   align-content: flex-start;
                   justify-content: space-around;
                   box-sizing: border-box }		

     .content aside img { width: 300px }				 
				
	
.checkbox, .radio { opacity: 0;
                    position: absolute }

 .checkbox, .checkbox-label, .radio, .radio-label { display: inline-block;
                                                    vertical-align: middle;
                                                    margin: 5px;
                                                    cursor: pointer }

 .checkbox-label, .radio-label { position: relative; margin-right: 30px }

 .checkbox + .checkbox-label:before, .radio + .radio-label:before {
    content: '';
    background: #fff;
    border: 1px solid #8f8f8f;
    display: inline-block;
    vertical-align: middle;
    width: 8px;
    height: 8px;
    padding: 2px;
    margin-right: 7px;
    text-align: center }

 .checkbox:checked + .checkbox-label:before { background: #008080 }

 .radio + .radio-label:before { border-radius: 50% }

 .radio:checked + .radio-label:before { background: #008080 }
 
 
table.main_kovriki { width: 100%; margin-top: 30px; margin-bottom: 20px }

  table.main_kovriki h4 { margin: 0 0 15px 0;
                           font-size: 16px;
						   color: #444 }

  table.main_kovriki th { width: 55%;
                           padding-left: 25px;
				           text-align: left;
						   border-radius: 11px 0 0 11px;
				           font-weight: normal;
				           line-height: 1.5;
                           vertical-align: middle;
                           background-color: #f5f9fb }
				   
  table.main_kovriki button { border: none; 
                               margin-top: 10px;
                               padding: 7px 15px;
			                   border-radius: 5px;
                               color: #eee;
				               font-size: 15px;
                               background-color: #008080;
                               cursor: pointer }					   
				   
  table.main_kovriki td { width: 45% }
    table.main_kovriki td img { width: 100%; display: block }	
  
  
.about_products { width: 100%;
				  display: flex;
                  flex-direction: row;
                  flex-wrap: wrap;
                  align-items: flex-start;
                  align-content: flex-start;
                  justify-content: space-around;
                  box-sizing: border-box }
	
  .about_products article { width: 330px;
				 		    margin-top: 30px;
						    padding-bottom: 20px;
						    border-radius: 0 0 11px 11px;
						    background-color: #f5f9fb;
							cursor: pointer;
						    box-sizing: border-box }
							   
    .about_products article img { width: 100%;
	                              display: block }
								  
    .about_products article div img { width: 110px }
	.about_products article div:after { content: "";
                                        display: table;
                                        clear: both }								  
	
	.about_products article h3 { width: 100%; 
	                             margin: 20px 0 0 0; 
								 font: bold 16px 'Open Sans', sans-serif; 
								 color: #444; 
								 text-align: center }
 
  .about_products button { border: none; 
                           margin-top: 10px;
						   margin-bottom: 25px;
                           padding: 7px 15px;
			               border-radius: 5px;
                           color: #eee;
				           font-size: 15px;
                           background-color: #008080;
                           cursor: pointer }	  


.kovriki { width: 100%;
           display: flex;
           flex-direction: row;
           flex-wrap: wrap;
           align-items: flex-start;
           align-content: flex-start;
           justify-content: space-around;
           box-sizing: border-box }
		   
  .kovriki article { width: 350px;
					 padding-bottom: 20px;
				     margin-bottom: 30px;
		  			 background-color: #f5f9fb;
                     /*font: normal 16px 'Open Sans', sans-serif;*/
					 color: #222;
					 border-bottom-right-radius: 11px;
					 border-bottom-left-radius: 11px;
					 box-sizing: border-box }	
	.kovriki article:last-child { margin-bottom: 0 }

    .kovriki article img { width: 100%; display: block }

    .kovriki article h4 { width: 100%; 
	                      text-align: center; 
						  margin: 15px 0;
                          font-size: 18px;
                          font-weight: normal;
				          line-height: 1 }
						  
	.kovriki article p { width: 100%; 
	                     margin: 0;
	                     padding: 0 15px; 
						 box-sizing: border-box }
						 
	.kovriki article li { margin-left: -10px }
						 

.precedence { width: 100%;
              margin-top: 10px; 
			  margin-bottom: 30px;
			  padding: 0 15px;
			  box-sizing: border-box }

  .precedence h5 { margin: 0 0 5px 0;
                   font: bold 15px 'Open Sans', sans-serif }

  .precedence h5 img { width: 30px; 
                       margin-right: 10px; 
					   vertical-align: middle }
					 
  .precedence p { margin: 0 0 20px 0; line-height: 1.5 }
    .precedence p:last-child { margin-bottom: 0 }
  

.products { width: 100%;
		    display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-items: flex-start;
            align-content: flex-start;
            justify-content: space-around;
            box-sizing: border-box }
	
  .products section { width: 350px; 
	                  margin-bottom: 30px;
	                  border: 1px solid silver;
                      border-radius: 15px;
		              padding: 17px;
                      text-align: center;
		              cursor: pointer;
                      box-sizing: border-box }
		  
	.products section h1 { font: normal 20px 'Open Sans', sans-serif;
	                       color: #222;
                           margin: 0 0 20px 0 }
						   
	.products section img { width: 250px }
	
	.products section ul { margin-bottom: 20px }
	  .products section ul li { margin: 0;
	                            font-size: 15px;
					            text-align: left }	
					
	.products section span { color: #800000 }
	

.order { width: 100%; 
         margin: 20px 0 50px 0;
		 padding: 0 15px;
		 box-sizing: border-box }

  .order h2 { margin: 0 0 10px 0;
              font: bold 19px 'Mulish', sans-serif }

  .order h4 { margin: 15px 0 7px 0;
              font: bold 15px 'Open Sans', sans-serif }
    .order h4:first-child { margin-top: 0 }			  
	
  .order section,
  .order article { width: 100%;
                   margin-bottom: 30px;
	               display: flex;
                   flex-direction: row;
                   flex-wrap: wrap;
                   align-items: flex-start;
                   align-content: flex-start;
                   justify-content: space-start;
                   box-sizing: border-box }		
						 
    .order section div { width: 140px; 
                         font-size: 14px; 
		   			     margin: 10px 20px 10px 0;
					     padding: 3px;
					     border: 1px solid white }		
					 
    .order article div { width: 160px; 
                         font-size: 14px; 
					     margin: 6px 20px 6px 0 }						 
					 
      .order section div#ACURA { border-color: #008080 }					 

      .order section div img { width: 25px;
                               margin-right: 5px;
                               vertical-align: middle }		

  .order table { box-sizing: border-box }	
  
    .order th { width: 65px;
                height: 80px;
                text-align: left }
				  
      .order th img { width: 45px }
  
      .order td.change_color { box-sizing: border-box }
  
      .order td.change_color img { padding: 1px; 
                                   margin-right: 6px;
                                   border: 1px solid white; 
	 	   		 		           border-radius: 15px;
	 							   cursor: pointer } 
        .order td.change_color img:last-child { margin-right: 0 }									  
        .order td.change_color img#black { border-color: green } 		

  .order p.border_color img { width: 27px; 
                              padding: 2px; 
	  				  		  margin-right: 6px; 
							  border: 1px solid white; 
							  cursor: pointer }			
    .order p.border_color img:last-child { margin-right: 0 }	
    .order p.border_color img#border_black { border-color: #008080 }

  .order input[type="text"],
  .order input[type="email"] { vertical-align: middle;
                               margin: 0;
                               padding: 0;
                               color: #222;
	                           border: 1px solid #8f8f8f;
                               padding: 5px 7px;
                               font-family: inherit;
                               font-size: 15px;
						       outline: none;
                               box-sizing: border-box }
								 
    .order input:focus::placeholder { color: transparent } 

    .order input[type="text"]:focus,
    .order input[type="email"]:focus { color: inherit;
                                       border: 1px solid darkgreen;
                                       outline: none }
										 
  .order textarea { width: 300px;
                    height: 100px;
                    border: 1px solid #8f8f8f;
                    padding: 5px 7px;
                    font-family: inherit;
                    font-size: 15px;
                    outline: none;
                    box-sizing: border-box }
					  
    .order textarea:focus { color: inherit;
                            border: 1px solid darkgreen;
                            outline: none }										 

  .order button { border: none;
                  margin-top: 25px;
                  padding: 7px 17px;
			      border-radius: 5px;
                  color: #eee;
				  font-size: 15px;
                  background-color: #008080;
                  box-sizing: border-box }
				  
  .order span { color: #e17100 }
  
  
.swal-modal { width: 300px }
.swal-title { font-size: 18px }
.swal-text {font-size: 16px }
.swal-button { padding: 7px 19px;
               border: none;
               background-color: #008080;
               font-size: 14px }
				   

address { width: 100%;
          font-size: 16px;
		  font-style: normal;
          line-height: 1.7;
          margin-bottom: 30px }
		  
  address h3 { margin: 0 0 10px 0;
               font-size: 19px;
	 		   font-weight: normal }
			  
  address img { margin-right: 12px;
  	            vertical-align: middle }							 


.tablefoot { width: 100%; margin-top: 20px;
             padding: 15px 0;
			 display: flex;
             flex-direction: row;
             flex-wrap: nowrap;
             align-items: center;
             align-content: center;
             justify-content: space-around;
			 background-color: #f7f7f7;
             box-sizing: border-box }
			 
  .tablefoot img { width: 30px }			 
				

footer { width: 100%;
         height: 40px;
         margin-top: 30px;
		 padding: 0 15px;
		 background-color: #42474a;
         font: normal 14px 'Mulish', sans-serif;
		 color: #ccc;
		 display: flex;
         flex-direction: row;
         flex-wrap: nowrap;
         align-items: center;
         align-content: center;
         justify-content: space-between;
         box-sizing: border-box }
		 
@media screen and (max-width: 330px)
 { .about_content article { width: 290px;
				 		    font-size: 14px }
     .about_content article img { margin-right: 10px; width: 35px }	
	 
   .products section { width: 290px; 
	                   padding: 12px }
	 .products section img { width: 210px }
	 
   .about_products article { width: 290px }	 
	 
   .kovriki article { width: 290px }	 
 }		 
		 
@media screen and (min-width: 331px) and (max-width: 380px)
 { .products section { width: 300px; 
	                   padding: 14px }
	 .products section img { width: 230px } 
 }		 
		 
@media screen and (max-width: 430px)
 { .main_kovriki { display: none } }	 
 
@media screen and (min-width: 450px)
 { .main_kovriki2 { display: none } } 