@import url("boxiconsmin.css");
@font-face { font-family: Roboto; 
			 src: url('Roboto/MusticaPro-SemiBold.otf'); } 

/*<img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABgAAAAYCAYAAADgdz34AAABHUlEQVRIS83VwTEFQRSF4e9FgAyIABEgAjLAlgUiQARs2CICZEAEiAARIALqqplXY9687q4ao5zNLPrO/fv0mdszMrBGA/f3p4DPhptTHPyGu6aDJiB6r+GuL6TriPZxgltsDAGYxVvVeAEvfSDTQr7EZo/Gj1iO96cBlvDQA/CK+RQg1mIXi9hGOCpR7fwYRznAFi4q0LfdjCK7Z8RznF1u0N4xU51nOEqp3tA9VuvCHCAGbg9XiAYpxcystI80B4igwnZoDuGoS3XdRxXuuC4HiGY3WK+ujnDUpQj0sMtpCSCm+TqXcLU+cb2UAOLd+pNNcZ4Q8/NDpYBCA5NlpYAz7OAcu602qbXiH07zKm9vKrVWDBjcweAZ/F/AF4BhMxlWUaegAAAAAElFTkSuQmCC"/>

+++ Text +++
:root {
--main-txt-color: #7d3f04;
--link-color: gray;
--main-txt-font: Ebrima;
--text-top: Arial Black;
}

+++ Font +++
:root {
--header-height: 3rem;
--font-semi: 600;
--font-bold: 650;
}

+++ Fontsize +++
:root {
--body-font: 'Open Sans', sans-serif;
--big-font-size: 3rem;
--h1-font-size: 1.5rem;
--h2-font-size: 1.25rem;
--normal-font-size: .938rem;
--small-font-size: .75rem;
}

+++ Bigscreen +++


:root {

--big-font-size: 6rem;
--h1-font-size: 2.25rem;
--h2-font-size: 1.5rem;
--normal-font-size: 1rem;
--small-font-size: .813rem;
}
}

+++ Marg +++
:root {
--mb-1: .5rem;
--mb-2: 1rem;
--mb-3: 1.5rem;
--mb-4: 2rem;
}

+++ z index +++
:root {
--z-tooltip: 10;
--z-fixed: 100;
}
*/

/*+++ Base +++*/

*{
margin: 0;
padding: 0;
box-sizing: border-box;
}

html{
scroll-behavior: smooth;
}
 body{background-image: url(r1.jpg);
background-size: cover;
background-repeat: no-repeat;
background-attachment: fixed;
color: #7d3f04;
font-family: roboto,!important;
margin: 3rem 0 0 0; 
font-size: .938rem;
line-height: 1.5;

	 }
	 
	 
	  h1,h2,p{
	 margin: 0;
	 }
	 
	  ul{
	 margin: 0;
	 list-style-type: none
	 }
	 
	 
	  table {
    border: 1px solid #7d3f04;
background-color:#FFEBCD;
padding:3px;
color: #7d3f04
}
	 th, td {
    border: 1px solid #edd1b6;
	}
	
	.step4 {
	font-size: .5rem;
	}
	 
	
	
/*-----------gridpage-----------*/ 
.grid{font-family: Roboto;
display: grid;
grid-gap: 15px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
". . cont1 cont2 cont2 . . ."
". . cont3 cont4 . . . ."
"cont5 cont5 cont5 cont5 cont5  cont5  cont5 cont5"
;
}
.grid  a {color: gray;
text-decoration: none;
}

.grid  a:hover {color: gray;
font-weight: bold;
text-decoration: none;
}

/*-----------logo-----------*/
.cont1 {
grid-area: cont1;

padding-top: 0.5%;
 
}
.logo {width: 270px;
}


.cart1{
display: none;
}
.menu1{
display: none;
}
.album1{
display: none;
}

.menu-mobile{
display: none;
}
.menu-mobile1{
display: none;
}



/*---------topmenu+image+slide---------*/
.cont2 {
grid-area: cont2;
max-width: 1300px;
padding-top: 0.5%;}

.j{
display: grid;
grid-gap: 1px;
grid-template-columns: 1fr 1fr;
grid-template-areas:
"j1 j2"
"j3 j3"
;

}

.navbar{grid-area: j1;
width:190%;
display: flex;
padding-left: 10%;
padding-bottom: 2%;

}
.cart{
grid-area: j2;}


.cart:hover{
opacity: 0.7;
}
nav1{
flex: 1;
text-align: left;
}

nav1 ul{

display: inline-block;

border-radius: 18px;
background-image: url(m7.jpg);
    background-position: left top;
    background-repeat: repeat;
	background-size: cover;
width: 100%;
height:100%;
margin: 0;
padding: 0;
text-align: center;

}
nav1 ul li {
display: inline-block;

border-radius: 15px;
    padding: 2%;
    margin-left: 1%;
    background-color :#FFEBCD;
    color: #7d3f04;
    box-shadow: 0 1px 2px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);
}
nav1 ul li:hover {background-color: #edd1b6}





.i{ grid-area: j3;
background: #d2b48c;
	 border: 0.1px solid #dcdcdc;
	 position:relative ;
 }
 
 
.i {width: 810px;
height:170px;
 }
 

.layer1, .layer2, .layer3{position:absolute;
width: 100%;
height:100%;
top:0px;
left:0px;
background-size:cover;
background-repeat:no-repeat;
}
.layer1{ background-image:url(p333.jpg);
}
.layer2{ background-image:url(p7.jpg);
animation:layer2Anim 10s infinite;
}
.layer3{ background-image:url(p9.jpg);
animation:layer3Anim 10s infinite;
}


@keyframes layer2Anim {
    0%{opacity:0;}
    17%{opacity:0;}
    33%{opacity:1;}
    50%{opacity:1;}
    67%{opacity:0;}
    100%{opacity:0;}
}
@keyframes layer3Anim {
    0%{opacity:0;}
    50%{opacity:0;}
    67%{opacity:1;}
    83%{opacity:1;}
    100%{opacity:0;}
}

/*-----------leftmenu-----------*/
.cont3 {
grid-area: cont3;

max-width: 1300px;
display: flex;
align-items: left;
flex-wrap: wrap;


}

nav{
flex: 1;



}
nav ul{
width: 250px;
display: inline-block;

border: 3px solid #FFE4C4;
border-radius: 18px;
background-image: url(lmb.jpg);
    background-position: left top;
    background-repeat: repeat;
	background-size: cover;


padding: 3%;
text-align: center;


}
nav ul li {
display: block;

border-radius: 15px;
cellpadding: 5%;
    padding: 5%;
    margin-bottom: 3.5%;
	margin-left: 1%;
	margin-right: 1%;
    background-color :#FFEBCD;
    color: #7d3f04;
    box-shadow: 0 1px 2px rgba(0,0,0,0.12),0 1px 2px rgba(0,0,0,0.24);
	
}
nav ul li:hover {background-color: #edd1b6}



	
/*-----------windowinfo----------*/

.cont4 {
grid-area: cont4;

width:810px;
background: #d2b48c;
	 border: 0.1px solid #dcdcdc;

}
.s{ display: grid;
grid-gap: 10px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
"s1 s1 s1 s1 s1 s1 s1 s1 s1 ."
". . . . . . . . s2 s3"
". s4 s4 s4 s4 s4 s4 s4 . ."
"s5 s5 s5 s5 s5 s5 s5 s5 s5 s5"
". s6 s6 s6 s6 s6 s6 s6 s6 ."

;
max-width: 750px;
position:relative ;

 }
.imgp{ grid-area: s1;
color:#7d3f04; 
font-family: Roboto;
    font-size: 130%;
text-shadow: 2px 2px 5px #000000;
  position: relative;
  padding-top: 5%;
 padding-left: 5%;

}

/*---------text Karieri i checkout ---------*/

.kar {grid-area: s4;}

.kar h2{color:#7d3f04; 
font-family: Roboto;
    font-size: 150%;
text-shadow: 2px 2px 5px #000000;
padding-left: 2%;}
.kar p{
	 margin: 2%;
	 color:#21100D;
	 font-weight:bold;
	 }
.kar li{
	 margin: 2%;
	 color:#7d3f04;
	 font-weight:bold;
	 }
.kar button{ margin: 2%;
padding:1%;
border: 1px solid #7d3f04;
background-color:#FFEBCD;
color: #7d3f04
}
.email {grid-area: s6;}

.email h3{color:#7d3f04; 
font-family: Roboto;
    font-size: 100%;
text-shadow: 2px 2px 5px #000000;
padding-left: 2%;}

.email h2{color:#7d3f04; 
font-family: Roboto;
    font-size: 150%;
text-shadow: 2px 2px 5px #000000;
padding-left: 2%;}
.email p{
	 margin: 2%;
	 color:#21100D;
	 font-weight:bold;
	 }
.email li{
	 margin: 2%;
	 color:#7d3f04;
	 font-weight:bold;
	 }
.email button{ margin: 2%;
padding:1%;
border: 1px solid #7d3f04;
background-color:#FFEBCD;
color: #7d3f04
}
	 
	 /*---------text za Nas---------*/

.zanas {grid-area: s5;}

.zanas h2{color:#7d3f04; 
font-family: Roboto;
    font-size: 150%;
text-shadow: 2px 2px 5px #000000;
padding-left: 2%;}
.zanas p{
	 margin: 2%;
	 color:#21100D;
	 font-weight:bold;
	 }

/*-----------flags-----------*/
.b{grid-area: s2;
position: relative;
 }

.b img:hover {
    border: 2px solid #777;
}

.e{grid-area: s3;

position: relative;
}

.e img:hover {
    border: 2px solid #777;}
	
	
	
/*-----Orders------*/
.prod{ display: grid;
grid-gap: 10px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
". . d1 d1 d1 d1 d1 d1 d1 d1"
". . d2 d3 . . . . . . "
". . d4 d5 . . . . . . "
". . d12 d12 d12 d12 d12 d12 d12 d12"
;
max-width: 750px;
position:relative ;
}

.prodtext1{grid-area: d1;

position: relative;
}

.pref{grid-area: d12;

position: relative;
}
/*---------images+buttons---------*/
.q{ display: grid;
grid-gap: 8px;
grid-template-columns: repeat (6, 1fr);
grid-template-rows: repeat (15, 1fr);

max-width: 750px;
position:relative ;
padding-top: 1.5%;
 padding-left: 2%;
 padding-bottom: 3%;
 }

 .q img{
 width:250px; height:250px;

 }
 
.img1 {grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 3;
position:relative ;
}
.img1 img{
width:250px; height:250px;
/*margin-top: ;
 margin-left: ;*/
 }
.img2 {grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 1;
grid-row-end: 3;
position:relative ;
}
.img3 {
grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 1;
grid-row-end: 3;
position:relative ;	
}
.img4 {grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 4;
grid-row-end: 6;
position:relative ;
}
.img5 {grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 4;
grid-row-end: 6;
position:relative ;
}
.img6 {grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 4;
grid-row-end: 6;
position:relative ;
}
.img7 {grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 7;
grid-row-end: 9;
position:relative ;
}
.img8 {grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 7;
grid-row-end: 9;
position:relative ;
}
.img9 {grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 7;
grid-row-end: 9;
position:relative ;
}
.img10 {grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 10;
grid-row-end: 12;
position:relative ;
}
.img11 {grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 10;
grid-row-end: 12;
position:relative ;
}
.img12 {grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 10;
grid-row-end: 12;
position:relative ;
}
.img13 {grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 13;
grid-row-end: 15;
position:relative ;
}
.img14 {grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 13;
grid-row-end: 15;
position:relative ;
}
.img15 {grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 13;
grid-row-end: 15;
position:relative ;
}

.img1:hover , .img2:hover , .img3:hover ,
.img4:hover,.img5:hover ,.img6:hover ,
.img7:hover,.img8:hover,.img9:hover ,
.img10:hover,.img11:hover,.img12:hover ,
.img13:hover,.img14:hover,.img15:hover ,
.gal1:hover,.gal2:hover ,.gal3:hover 
{opacity: 0.9;
    } 
	
.img1:hover img ,.img2:hover img , .img3:hover img ,
.img4:hover img , .img5:hover img , .img6:hover img,
.img7:hover img , .img8:hover img , .img9:hover img,
.img10:hover img , .img11:hover img , .img12:hover img,
.img13:hover img , .img14:hover img , .img15:hover img
{margin-top: -1%;
transition: all 0.15s;
    } 
 
 
a.but111 , a.but222 , a.but333,
a.but444 , a.but555 , a.but666,
a.but777 , a.but888 , a.but999,
a.but101010 , a.but111111 , a.but121212,
a.but131313 , a.but141414 , a.but151515{ 
width:250px;
display:inline-block;
padding:0.5em 3em;
border:0.16em solid #f5e5d6;
margin:0 0.3em 0.3em 0;
box-sizing: border-box;
text-decoration:none;
text-transform:uppercase;
font-family:Roboto;
font-weight:400;
color:#f5e5d6;
text-align:center;
transition: all 0.15s;
}
a.but111:hover , a.but222:hover , a.but333:hover , 
a.but444:hover , a.but555:hover , a.but666:hover ,
a.but777:hover , a.but888:hover , a.but999:hover,
a.but101010:hover , a.but111111:hover , a.but121212:hover,
a.but131313:hover , a.but141414:hover , a.but151515:hover{
color:#944a05;
border-color:#944a05;
}
a.but111:active , a.but222:active , a.but333:active ,
a.but444:active , a.but555:active , a.but666:active ,
a.but777:active , a.but888:active , a.but999:active,
.but101010:active , a.but111111:active , a.but121212:active,
a.but131313:active , a.but141414:active, a.but151515:active{
color:#BBBBBB;
border-color:#BBBBBB;
}
@media all and (max-width:30em){
a.but111 , a.but222 , a.but333 ,
a.but444 , a.but555 , a.but666 ,
a.but777 , a.but888 , a.but999,
a.but101010 , a.but111111 , a.but121212,
a.but131313 , a.but141414 , a.but151515
{
display:block;
margin:0.4em auto;
}
}

.but1{
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 3;
grid-row-end: 4;
position:relative ;	
}
.but2{
grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 3;
grid-row-end: 4;
position:relative ;	
} 

.but3{
grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 3;
grid-row-end: 4;
position:relative ;	
} 

.but4{
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 6;
grid-row-end: 7;
position:relative ;	
}
.but5{
grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 6;
grid-row-end: 7;
position:relative ;	
} 

.but6{
grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 6;
grid-row-end: 7;
position:relative ;	
} 

.but7{
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 9;
grid-row-end: 10;
position:relative ;	
}
.but8{
grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 9;
grid-row-end: 10;
position:relative ;	
} 

.but9{
grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 9;
grid-row-end: 10;
position:relative ;	
} 
.but10{
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 12;
grid-row-end: 13;
position:relative ;	
}
.but11{
grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 12;
grid-row-end: 13;
position:relative ;	
} 

.but12{
grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 12;
grid-row-end: 13;
position:relative ;	
} 
.but13{
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 15;
grid-row-end: 16;
position:relative ;	
}
.but14{
grid-column-start: 3;
grid-column-end: 5;
grid-row-start: 15;
grid-row-end: 16;
position:relative ;	
} 

.but15{
grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 15;
grid-row-end: 16;
position:relative ;	
} 




	 
	 
/*---------Kontakti---------*/

.map{grid-column-start: 1;
grid-column-end: 5;
grid-row-start: 1;
grid-row-end: 3;
position:relative ;}

.map iframe {width:400px; 
height:300px; 
border:0;
} 

.tel{grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 1;
grid-row-end: 3;
position:relative ;}

.map1{grid-column-start: 1;
grid-column-end: 5;
grid-row-start: 5;
grid-row-end: 7;
position:relative ;}

.map1 iframe {width:400px; 
height:300px; 
border:0;
} 

.tel1{grid-column-start: 5;
grid-column-end: 7;
grid-row-start: 5;
grid-row-end: 7;
position:relative ;}

.tel h2{color:#7d3f04; 
font-family: Roboto;
    font-size: 150%;
text-shadow: 2px 2px 5px #000000;
padding-left: 2%;}
.tel p {
	 margin: 3%;
	 color:#21100D;
	 font-weight:bold;
	 }
.tel1 p{
	 margin: 3%;
	 color:#21100D;
	 font-weight:bold;
	 }

	 
	 
	 
	 

/*---------galery+text/table----------*/
.gallery {  display: grid;

grid-gap: 2px;
grid-template-columns: repeat (12, 1fr);
grid-template-areas:
". G1 G1 G1 . . G2 G2 . . . ."
". G1 G1 G1 . . G2 G2 . . . ."
". G1 G1 G1 . . G2 G2 . . . ."
"G3 G3 G3 G3 G3 G3 G4 G4 G4 G4 G4 ."
"G3 G3 G3 G3 G3 G3 G4 G4 G4 G4 G4 ."
"G3 G3 G3 G3 G3 G3 G4 G4 G4 G4 G4 ."
;

max-width: 850px;
position:relative ;
padding-top: 1.5%;
 padding-left: 1.5%;
 padding-bottom: 3%;
 }
.big{grid-area: G1;

position: relative;
}
.descrip{grid-area: G2;

position: relative;
}
.table{grid-area: G3;

position: relative;
}
.tabdes{grid-area: G4;

position: relative;
}

.descrip h2{
color:#7d3f04; 
font-family: Roboto;
font-size: 150%;
text-shadow: 2px 2px 5px #000000;
padding-bottom:3%; 
}

.descrip p{ padding-bottom:1%;
color: #330000;
font-size: 100%;
}



.big{ display: grid;

grid-gap: 2px;
grid-template-columns: repeat (6, 1fr);
grid-template-areas:
"big big big big big big"
"big big big big big big"
"big big big big big big"
"big big big big big big"
"sml1 sml1 sml2 sml2 sml3 sml3"
"sml1 sml1 sml2 sml2 sml3 sml3"
;

max-width: 315px;
max-height: 420px;
position:relative ;
padding-top: 1.5%;
 padding-left: 1.5%;
 padding-bottom: 3%;
 }

 

.big1 img{
width:305px; height:305px;
}

.small1 img,.small2 img,.small3 img{
width:100px; height:100px;
}
.gallery  img{
border-top: 3px solid #f5e5d6;
border-bottom: 3px solid #f5e5d6;
}

.big1:hover img,.small1 :hover img,.small2 :hover img,.small3 :hover img{
border-top-color: #7d3f04;
border-bottom-color: #7d3f04;

}
.big1 {grid-area: big;

position: relative;
}
.small1 {grid-area: sml1;

position: relative;
}
.small2 {grid-area: sml2;

position: relative;
}
.small3 {grid-area: sml3;

position: relative;
}

.tabdes{
display: grid;
grid-gap: 2.5%;
max-width: 780px;
position:relative ;
padding-top: 1.5%;
 padding-left: 2%;
 padding-bottom: 3%;

grid-template-columns: repeat (6, 1fr);

grid-template-areas:
"ty ty ty ty ty ty"
"nnn nnn nnn nnn nnn nnn"
"ord ord ord ord ord ord"
"gog gog gog gog gog gog"
"gog gog gog gog gog gog"
"gog gog gog gog gog gog"
;

}
.razm {grid-area: ty;
position:relative ;}
.bro{grid-area: nnn;
position:relative ;}
.order{grid-area: ord;
position:relative ;}
.gogo{grid-area: gog;
position:relative ;}


.table th {
align:center;
}



 .razm select {padding:1%;
border: 1px solid #7d3f04;
background-color:#FFEBCD;
cellpedding:3px;
color: #7d3f04}


.bro input {border: 1px solid #7d3f04;
background-color:#FFEBCD;
cellpedding:3px;
padding:1%;
color: #7d3f04}


.order button{ padding:2%;
border: 1px solid #7d3f04;
background-color:#FFEBCD;
color: #7d3f04
}

.gogo button{ padding:2%;
border: 1px solid #7d3f04;
background-color:#FFEBCD;
color: #7d3f04
}

.gogo h2{
color:#7d3f04; 
font-family: Roboto;
font-size: 130%;
text-shadow: 2px 2px 5px #000000;
padding-bottom:3%; 
}
.gogo p{ padding-bottom:1%;
color: #330000;
}



/*-----------footer-----------*/
.cont5 {
grid-area: cont5;

width: 104.5%;
background: url(m3.jpg);
    color: #f5e5d6;
	
font-family: Roboto;
	 border: 0.1px solid #dcdcdc;

}
.fo { display: grid;
grid-gap: 20px;
grid-template-columns: 1fr 1fr 1fr 1fr;
grid-template-areas:
"a1 a2 a3 uh"
"a1 a2 a3 a4"
;
position:relative ;
padding-top: 2%;
 padding-left: 5%;
 padding-bottom: 3%;
  
 
 }
 
 .fo a {color: #330000;
 text-decoration: none;
}

.fo  a:hover {color: #1a0000;
font-weight: bold;
font-size: 1rem;
}
.fo h1 {font-size: 1rem;
padding-bottom:5%;

}
.fo p {font-size: 0.75rem;
font-weight: bold;
padding-bottom:2%;

}
.fo  p:hover {
font-size: 0.78rem;
}

.nortek {
grid-area: a1;
position:relative ;	
}
.product {
grid-area: a2;
position:relative ;	
}
.oservic{
grid-area: a3;
position:relative ;	
}

.follow1{
grid-area: uh;
position:relative ;	
}
.follow{
grid-area: uh;
position:relative ;	
}

.follow img{width:130px; 
height:130px; 
padding-left:30%;
padding-top:0%;
}

.TEL1 p {color: #330000;

}
.CR1 p {color: #1a0000;

}









/*-----------Responsive part-----------*/



/*--------!!!!!!!Responsive part!!!!!!!--->max-width : 768px*/

@media screen and (max-width : 768px)
{
/*-----------gridpage-----------*/
.grid{
grid-gap: 10px;
grid-template-columns:  1fr 1fr ;
grid-template-areas:
"cont1 cont1"
"cont2 cont2"
"cont4 cont4"
"cont5 cont5"
;
}

.logo img{ 
margin-left:85%;
}
/*-----------topmenue-----------*/
.j{

grid-gap: 1px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
"j1 j1 j1 j2 ."
"j3 j3 j3 j3 j3"
;

}
.navbar{
max-width: 680px;
}
.cont2{
max-width: 680px;
}
.i , .cont5 , .cont4{ 
width: 760px;
margin-left:1%;
margin-right:1%;
 }
 
.cont3{
display: none;
}


/*-----------window-----------*/
.q{ 
grid-gap: 3px;
position:relative ;
padding-top: 2%;
 padding-left: 1%;
 padding-bottom: 4%;
 }
 
.q img{
 width:230px; height:230px;
 }
 
.gal1 img{
width:475px; height:475px;
}
.galg{
max-width: 720px;
}
.tabg{
max-width: 720px;
}
 
a.but111 , a.but222 , a.but333,
a.but444 , a.but555 , a.but666,
a.but777 , a.but888 , a.but999,
a.but101010 , a.but111111 , a.but121212,
a.but131313, a.but141414, a.but151515
{ 
width:230px;
}

.s{ display: grid;
grid-gap: 10px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr ;
grid-template-areas:
"s1 s1 s1 s1 s1 s1 s1 ."
". . . . s2 s3 . ."
"s4 s4 s4 s4 s4 . . ."
"s5 s5 s5 s5 s5 s5 s5 s5"
"s6 s6 s6 s6 s6 s6 s6 s6"
;
max-width: 750px;
position:relative ;

 }
 .imgp{ 
    font-size: 80%;
  position: relative;
  padding-top: 5%;
 padding-left: 5%;

}
/*---------Kontakti---------*/

.map{grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 3;
position:relative ;}


.tel{grid-column-start: 3;
grid-column-end: 7;
grid-row-start: 1;
grid-row-end: 3;
position:relative ;}

.map1{grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 3;
grid-row-end: 7;
position:relative ;}


.tel1{grid-column-start: 3;
grid-column-end: 7;
grid-row-start: 3;
grid-row-end: 7;
position:relative ;}

.map iframe {width:280px; 
height:280px; 
border:0;
} 


.map1 iframe {width:280px; 
height:280px; 
border:0;
} 


.tel h2{
    font-size: 1rem;
}
.tel p,.tel1 p{
	 font-size: 0.8rem;
	 }



/*---------galery+text/table----------*/


 .gallery {  display: grid;

grid-gap: 2px;
grid-template-columns: repeat (7, 1fr);
grid-template-areas:
"G1 G1 G1 . G2 G2 ."
"G1 G1 G1 . G2 G2 ."
"G1 G1 G1 . G2 G2 ."
"G3 G3 G3 G4 G4 ."
"G3 G3 G3 G4 G4 ."
"G3 G3 G3 G4 G4 ."
;

max-width: 750px;
position:relative ;
padding-top: 1.5%;
 padding-left: 1.5%;
 padding-bottom: 3%;
 }




.big{ 

grid-gap: 0.5%;

grid-template-columns: repeat (3, 1fr);
grid-template-areas:
"big big big"
"big big big"
"sml1 sml2 sml3"
;
max-width: 260px;
max-height: 350px;
position:relative ;
padding-top: 1.5%;

 padding-bottom: 3%;
 }
.big1 img{
width:300px; height:300px;
}

.small1 img,.small2 img,.small3 img{
width:97px; height:97px;
}
 

.tabdes{
display: grid;
grid-gap: 2.5%;
max-width: 750px;
position:relative ;


grid-template-columns: repeat (6, 1fr);

grid-template-areas:
"ty ty ty ty ty ty"
"ty ty ty ty ty ty"
"nnn nnn nnn nnn nnn nnn"
"nnn nnn nnn nnn nnn nnn"
"ord ord ord ord ord ord"
"ord ord ord ord ord ord"
"gog gog gog gog gog gog"
"gog gog gog gog gog gog"
"gog gog gog gog gog gog"
;

}










/*-----------footer-----------*/
.fo{max-width: 750px;
}
.fo h1 {font-size: 1.25rem;
padding-bottom:5%;

}
.fo p {font-size: 0.75rem;
font-weight: bold;
padding-bottom:2%;
 
}


.follow {display: grid;
grid-gap: 2px;
grid-template-columns: repeat (12, 1fr);
grid-template-areas:
". . . face face face . . . . . ."
". . . inst inst inst . . . . . ."
". . TEL TEL TEL TEL TEL . . . . ."
". . . CR CR CR CR CR . . . ."
;
position:relative ;
padding-top: 2%;
 padding-bottom: 3%;
 }
  .face1{display: flex;
grid-area: face;
}

.inst1{display: flex;
grid-area: inst;

}
.TEL1{display: flex;
grid-area: TEL;

}


.CR1{display: flex;
grid-area: CR;

}











/*------Responsive part--->max-width : 560px*/

@media screen and (max-width : 560px)
{
/*-----------gridsite-----------*/
.grid{
grid-gap: 10px;
grid-template-columns:  1fr;
grid-template-areas:
"cont1"
"cont2"
"cont4"
"cont5"
;
}
.cont1 , .cont2 , .cont4 , .cont5  {
max-width: 560px; 
margin-left:0;
margin-left:0%;
margin-right:0%;
}


/*---------logo + menus---------*/
.logo img{ 
margin-left: 0;
}
.cont11{
display: grid;
grid-gap: 2px;

grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
". b1 b1 b1 . . . ."
". . . . b2 b3 b4 ."

;
max-width: 560px;
}
.logo{grid-area: b1;
width:100px;
}
.menu1{grid-area: b2;
display: flex; 
}
.album1{grid-area: b3;
display: flex;
}
.cart1{grid-area: b4;
display: flex;
}


.menu1 img , .album1 img , .cart1 img 
.menu1:hover , .album1:hover , .cart1:hover
 {opacity: 0.7;
  cursor: pointer;
}

/*-----------topslise-----------*/
.j{
grid-gap: 10px;
grid-template-columns:  1fr;
grid-template-areas:
"j1"
"j2"
"j3"
;
}
.i{ grid-area: j3;
margin-left:0%;
margin-right:0%;
width: 560px;
}

/*-----------left menu 1/2-----------*/
.menu-mobile{ grid-area: j1;
height: 100%;
width: 0;
left: 0;
 position: fixed;
 z-index:1;
 top:0; 
 background-color: #7d3f04;
 opacity: 0.9; 
 overflow-x: hidden;
 padding-top:10px;
 transition:0.5s;
display: flex;
flex-direction: column;
}
.menu-mobile a{
padding: 10px 10px 10px 30px;
text-decoration: none;
font-size:12px;
color: #f5e5d6;
font-family: Roboto;
display: block;
transotion:0.4s;
}

.menu-mobile a:hover , 
.menu-mobile1 a:hover{ color:#e1b184;
}

.menu-mobile .close{ position: absolute;
top: -10px;
right: 0px;
font-size: 30px;
margin-left: 55px;
}


.menu-mobile1{ grid-area: j1;
height: 60%;
width: 0;
left: 0;
 position: fixed;
 z-index:1;
 top: 40%; 
 background-color: #7d3f04;
 opacity: 0.9; 
 overflow-x: hidden;
 padding-top:10px;
 transition:0.5s;
display: flex;
flex-direction: column;
}
.menu-mobile1 a{
text-decoration: none;
font-size:12px;
color: #f5e5d6;
font-family: Roboto;
}


.menu-mobile1 .close1{ position: absolute;
top: 0;
right: 7px;
font-size: 30px;
margin-left: 50px;
}
.menu-mobile1 .alb1{ position: absolute;
left: 10px;
}
.menu-mobile1 .alb2{ position: absolute;
left: 80px;
}
.menu-mobile1 .alb3{ position: absolute;
left: 10px;
top:80px;
}
.menu-mobile1 .alb4{ position: absolute;
left: 80px;
top:80px;
}
.menu-mobile1 .alb5{ position: absolute;
left: 10px;
top:150px;
}
.menu-mobile1 .alb6{ position: absolute;
left: 80px;
top:150px;
}
.menu-mobile1 .alb7{ position: absolute;
left: 10px;
top:220px;
}
.menu-mobile1 .alb8{ position: absolute;
left: 80px;
top:220px;
}
.menu-mobile1 .alb9{ position: absolute;
left: 10px;
top:290px;
}
.menu-mobile1 .alb10{ position: absolute;
left: 80px;
top:290px;
}

.menu-mobile1 .alb1:hover ,
.menu-mobile1 .alb2:hover , 
.menu-mobile1 .alb3:hover ,
.menu-mobile1 .alb4:hover ,
.menu-mobile1 .alb5:hover ,
.menu-mobile1 .alb6:hover ,
.menu-mobile1 .alb7:hover,
.menu-mobile1 .alb8:hover,
.menu-mobile1 .alb9:hover,
.menu-mobile1 .alb10:hover,
.menu-mobile1 .alb11:hover,
.menu-mobile1 .alb12:hover{
  cursor: pointer;
  opacity: 0.7;
}

/*-----------window-----------*/
.q {
max-width: 520px;
}

.q img{
 width:150px; height:150px;}

a.but111 , a.but222 , a.but333,
a.but444 , a.but555 , a.but666,
a.but777 , a.but888 , a.but999,
a.but101010 , a.but111111 , a.but121212,
a.but131313 , a.but141414 , a.but151515{ 
width:150px;
font-size: 0.75rem;
margin:0 0 0 0;
}

.navbar{
display: none;
}
.cont3{
display: none;
}
.s{
grid-gap: 10px;
max-width: 520px;

grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
"s1 s1 s1 . . ."
". . . s2 s3 ."
"s4 s4 s4 s4 s4 s4"
"s5 s5 s5 s5 s5 s5"
"s6 s6 s6 s6 s6 s6"
;
position:relative ;}


/*---------text za Nas---------*/

.zanas {
max-width: 520px;}

.zanas h2{
    font-size: 1.25rem;
padding-left: 1%;}
.zanas p{font-size: 1rem;
	 margin: 0.5%;
	 	 }
		 
/*---------text Karieri---------*/


.kar h2{font-size: 190%;
padding-left: 2%;}
.kar p{
	font-size: 150%;
	 margin: 2%;
	 }
		 
		 


/*---------Kontakti---------*/



.map iframe {width:250px; 
height:250px; 
border:0;
} 


.map1 iframe {width:250px; 
height:250px; 
border:0;
} 


.tel h2{
    font-size: 1rem;
}
.tel p,.tel1 p{
	 font-size: 0.8rem;
	 }


/*---------galery+text/table----------*/
 .gallery {  display: grid;

grid-gap: 2px;
grid-template-columns: repeat (8, 1fr);
grid-template-areas:
". G1 G1 G1 . . . ."
". G1 G1 G1 . . . ."
". G2 G2 G2 . . . ."
". G3 G3 G3 . . . ."
". G3 G3 G3 . . . ."
". G4 G4 G4 . . . ."
;

max-width: 430px;
position:relative ;
padding-top: 1.5%;
 padding-left: 0.5%;
 padding-bottom: 3%;
 }
 
 .big{ 

grid-gap: 0.5%;

grid-template-columns: repeat (3, 1fr);
grid-template-areas:
"big big sml1"
"big big sml2"
"big big sml3"
;
max-width: 350px;
position:relative ;
padding-top: 1.5%;

 padding-bottom: 3%;
 }

max-width: 420px;
 }
 
.galg{margin-top: 0;
max-width: 500px;
}

.big1 img{
width:250px; height:250px;
}

.small1 img,.small2 img,.small3 img{
width:80px; height:80px;
}

 .tabg{
max-width: 520px;

grid-template-columns: repeat (6, 1fr);
grid-template-rows: repeat (2, 1fr);
grid-template-areas:
". . . r r . ."
". . . u u . ."
;
}

.r p{ font-size: 1.25rem;
}

.r h2{ font-size: 1.25rem;
}
.tabdes p {
font-size: 1rem;
}
.table tr {
font-size: 0.80rem;
}


/*-----------footer-----------*/

/*.follow{
display: none;
}*/

.follow1{
display: none;
}
.fo {  display: grid;
  grid-gap: 5px;
  grid-template-columns:repeat (9, 1fr);
    grid-template-areas:
        "a1 a2 a3 . . . . ."
        "a1 a2 uh . . . . .";
    position: relative;
    padding-top: 2%;
    padding-left: 1%;
    padding-bottom: 3%;
}

.fo{max-width: 680px;
}

.follow {
position:relative ;
padding-top: 2%;
padding-left: 5%;
 padding-bottom: 3%;
 }
 
 
.fo  a:hover {color: #1a0000;
font-weight: bold;
font-size: 1rem;
}
.fo h1 {font-size: 1rem;
padding-bottom:7%;
text-align: center;

}
.fo p {font-size: 0.75rem;
font-weight: bold;
padding-bottom:6%;
text-align: center;

}
.fo  p:hover {
font-size: 1.02rem;
}
 

.fo img {width:100px; 
height:100px; 
padding-left:30%;
padding-top:0%;

}

 
 
 
 

 
 
 
 


/*-----------Responsive part--->max-width : 414px*/
@media screen and (max-width : 414px)

/*-----------Responsive part--->max-width : 414px*/
{

.cont1 , .cont2 , .i, .q,.s,.cont4 , .cont5  {
max-width: 400px;  
margin-left:0;
margin-left:0.5px;
margin-right:0%;
}




/* zabavno menu*/

.cont4  { overflow-y: auto;
height:100vh;
overflow-x: hidden;
 }


 
 

.cont11{
display: grid;
grid-gap: 5px;

grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr ;
grid-template-areas:
". . b1 b1 b1 . . . . "
". . . . . . . . . "
". . . . . b2 b3 b4 ."

;
}
.logo{grid-area: b1;
width:100px;
}
.menu1{grid-area: b2;
display: flex; 
}
.album1{grid-area: b3;
display: flex;
}
.cart1{grid-area: b4;
display: flex;
}

.menu1 img , .album1 img , .cart1 img 
{width: 40px;
}
.menu1:hover , .album1:hover , .cart1:hover
 {opacity: 0.7;
  cursor: pointer;
}
.logo img{width:210px;
}
.menu1 img , 
.cart1 img , 
.album1 img{
width:25px;
}


.menu-mobile a{
font-size:12px;
}

.cont5{
margin-left:0;}


/*-----------window-----------*/


.s{ 
grid-gap: 10px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr  ;
grid-template-areas:
"s1 s1 s1 s1 ."
". . s2 s3 ."
"s4 s4 s4 . ."
"s5 s5 s5 s5 s5"
"s6 s6 s6 s6 s6"
;
max-width: 414px;
position:relative ;

 }
 
 .s h1 {
font-size: 1.5rem;
}

.tabdes p {
font-size: 0.75rem;
}
.table tr {
font-size: 0.75rem;
}

.q{

grid-gap: 2%;
grid-template-columns: repeat (1fr 1fr 1fr 1fr);
grid-template-areas:
". pic1 pic2 . "
". tt1 tt2 . "
". pic3 pic4 . "
". tt3 tt4 . "
". pic5 pic6 . "
". tt5 tt6 . "
". pic7 pic8 . "
". tt7 tt8 . "
". pic9 pic10 . "
". tt9 tt10 . "
". pic11 pic12 . "
". tt11 tt12 . "
". pic13 pic14 . "
". tt13 tt14 . "
". pic15 pic16 . "
". tt15 tt16 . "

;
position:relative ;
}

.e  img , .b  img{width:30px;
}

.q img{
 width:150px; height:150px;}
 

.img1 {grid-area: pic1;
display: flex;
}
.img2 {grid-area: pic2;
display: flex;
}
.img3 {grid-area: pic3;
display: flex;
}
.img4 {grid-area: pic4;
display: flex;
}
.img5 {grid-area: pic5;
display: flex;
}
.img6 {grid-area: pic6;
display: flex;
}
.img7 {grid-area: pic7;
display: flex;
}
.img8 {grid-area: pic8;
display: flex;
}
.img9 {grid-area: pic9;
display: flex;
}
.img10 {grid-area: pic10;
display: flex;
}
.img11 {grid-area: pic11;
display: flex;
}
.img12 {grid-area: pic12;
display: flex;
 }
.img13 {grid-area: pic13;
display: flex;
}
.img14 {grid-area: pic14;
display: flex;
}
 .img15{grid-area: pic15;
display: flex;
}


.img1 img , .img2 img , .img3 img ,
.img4 img , .img5 img , .img6 img ,
.img7 img , .img8 img , .img9 img ,
.img10 img , .img11 img , .img12 img,
.img13 img , .img14 img , .img15 img{
margin-left: -5%;
}

.but1{grid-area: tt1;
display: flex;
	
}
.but2{grid-area: tt2;
display: flex;
} 

.but3{grid-area: tt3;
display: flex;	
} 

.but4{grid-area: tt4;
display: flex;
}
.but5{grid-area: tt5;
display: flex;
} 

.but6{grid-area: tt6;
display: flex;
} 

.but7{grid-area: tt7;
display: flex;
}
.but8{grid-area: tt8;
display: flex;
} 

.but9{grid-area: tt9;
display: flex;	
} 
.but10{grid-area: tt10;
display: flex;
} 
.but11{grid-area: tt11;
display: flex;	
} 
.but12{grid-area: tt12;
display: flex;
} 
.but13{grid-area: tt13;
display: flex;	
} 
.but14{grid-area: tt14;
display: flex;	
} 
.but15{grid-area: tt15;
display: flex;	
} 


a.but111 , a.but222 , a.but333,
a.but444 , a.but555 , a.but666,
a.but777 , a.but888 , a.but999,
a.but101010 , a.but111111 , a.but121212,
a.but131313 , a.but141414 , a.but151515{ 

width:150px;
font-size: 0.8rem;
margin:0;
margin-top: -2.5%;
margin-left: -5%;
}


 /*---------text za Nas---------*/

 .zanas {grid-area: pic1;}
 
 .zanas {
padding-bottom: 10%;}
.zanas h2{
    font-size: 1.5rem;
padding-left: 2%;}
.zanas p{font-size: 1rem;
	 margin: 2%;
	 	 }
		 
		 
/*---------text za Karieri---------*/
.kar h2{
    font-size: 1.5rem;
padding-left: 2%;}
.kar p{font-size: 1rem;
	 margin: 2%;
	 	 }
		 
 




/*---------Kontakti---------*/

.map{grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 4;
position:relative ;
padding-left:2%;
}

.map iframe {width:300px; 
height:300px; 
border:0;
} 

.tel{grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 4;
grid-row-end: 6;
position:relative ;
}

.map1{
grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 7;
grid-row-end: 9;
position:relative ;	
padding-left:2%;
}

.map1 iframe {width:300px; 
height:300px; 
border:0;
} 

.tel1{grid-column-start: 1;
grid-column-end: 3;
grid-row-start: 9;
grid-row-end: 12;
position:relative ;
}

.tel h2{
    font-size: 1.5rem;
}
.tel p,.tel1 p{
	 font-size: 1rem;
	 }
	 
	 

	 
	 
	 /*---------galery+text/table----------*/
	 .gallery {  display: grid;

grid-gap: 2px;
grid-template-columns: repeat (6, 1fr);
grid-template-areas:
". G1 G1 G1 . ."
". G1 G1 G1 . ."
". . . . . ."
". G2 G2 G2 . ."
". G3 G3 G3 . ."
". G3 G3 G3 . ."
". G4 G4 G4 . ."
;

max-width: 450px;
position:relative ;
padding-top: 1.5%;
 padding-left: 0.5%;
 padding-bottom: 3%;
 }
 
 .big{ 
grid-gap: 5px;

grid-template-columns: repeat (3, 1fr);
grid-template-areas:
"big big big"
"big big big"
"sml1 sml2 sml3"
;
max-width: 300px;
max-height: 700px; 
position:relative ;
padding-top: 1.5%;

 padding-bottom: 3%;
 }
 .descrip p
{ font-size: 0.8rem;
}

.descrip h2{ font-size: 1rem;
}
.descrip 
{ grid-area: G2;
}


 .gal1 img{
width:315px; height:315px;
}


.big1 img{
width:300px; height:300px;
}

.small1 img,.small2 img,.small3 img{
width:97px; height:97px;
}

.table{
max-width: 360px;}

 .tabg{
max-width: 360px;

grid-template-columns: repeat (6, 1fr);
grid-template-rows: repeat (2, 1fr);
grid-template-areas:
". . . r r . ."
". . . u u . ."
;
}

.r p{ font-size: 0.5rem;
}

.r h2{ font-size: 0.75rem;
}

.tabdes{display: grid;

grid-gap: 1%;
max-width: 300px;
position:relative ;

grid-template-columns: repeat (4, 1fr);
grid-template-areas:
"ty ty . ."
"ty ty . ."
"nnn nnn . ."
"ord ord . ."
"gog gog . ."
;

}
.tabdes p,button,select,input,ul{ font-size: 0.8rem;
}

.tabdes h2{ font-size: 1rem;
}
	 
	 
	 /*-----------footer-----------*/

 .fo{
grid-gap: 10px;
grid-template-columns:   1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
". . a1 . . ."
". . a2 . . ."
". . a3 . . ."
". . a5 . . ."
". . a4 . . ."
". . a6 . . ."
;
}
.follow1{display: flex;
grid-area: a5;
position: relative;
}
.follow{display: flex;
grid-area: a6;
position: relative;
}
.follow{
display: grid;
grid-gap: 10px;
grid-template-columns: repeat (12, 1fr);
grid-template-areas:
". . . . . face inst . . . . ."
". . . . . TEL TEL . . . . ."
". . . . . CR CR CR . . . ."
;
align-content: space-evenly;
}

.face1{display: flex;
grid-area: face;
}

.inst1{display: flex;
grid-area: inst;

}
.TEL1{display: flex;
grid-area: TEL;

}


.CR1{display: flex;
grid-area: CR;
padding-left:2%;
}

.follow1 {
padding-left:13%;

}


.follow img{width:80px; 
height:80px; 
padding-left:30%;
padding-top:10%;
}
 

.fo  a:hover {color: #1a0000;
font-weight: bold;
font-size: 0.5rem;
}
.fo h1 {font-size: 1.75rem;
padding-bottom:8%;
text-align: center;

}
.fo p {font-size: 1rem;
font-weight: bold;
padding-bottom:6%;
text-align: center;

}
.fo  p:hover {
font-size: 1.05rem;
}
}












/*-----------Responsive part--->max-width : 320px*/
@media screen and (max-width : 320px)
{

/*---------logo + menus---------*/
.cont11{
display: grid;
grid-gap: 5px;

grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr  ;
grid-template-areas:
". b1 b1 b1 . . ."
". . . . . . ."
". . . b2 b3 b4 ."

;
}
.logo img{width:300px;
}
.menu1 img , 
.cart1 img , 
.album1 img{
width:40px;
}


.menu-mobile a{
font-size:18px;
}

.cont5{
margin-left:0;}

/*-----------window-----------*/

.s{
grid-gap: 10px;
max-width: 310px;

grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
"s1 s1 . . . ."
". . . s2 s3 ."
"s4 s4 s4 s4 s4 s4"
"s6 s6 s6 s6 s6 s6"
;
position:relative ;

}
 
 .q{

grid-gap: 1%;
}

.img1 {
	padding-top: 0%;
 padding-left: 0%;
 padding-bottom: 0%;
}
.img13 {
	padding-top: 0%;
 padding-left: 0%;
 padding-bottom: 0%;
}


 



/*---------Kontakti---------*/

.map{grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 4;
position:relative ;
}

.map iframe {width:330px; 
height:330px; 
border:0;
} 

.tel{grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 4;
grid-row-end: 6;
position:relative ;
}

.map1{
grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 7;
grid-row-end: 9;
position:relative ;	
}

.map1 iframe {width:330px; 
height:330px; 
border:0;
} 

.tel1{grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 9;
grid-row-end: 12;
position:relative ;
}

.tel h2{
    font-size: 1.2rem;
}
.tel p,.tel1 p{
	 font-size: 0.9rem;
	 }

/*---------galery+text/table----------*/

.galg{padding-left: 0%;
max-width: 290px;
grid-gap: 40px;
grid-template-columns: repeat (3, 1fr);
grid-template-rows: repeat (3, 1fr);
}

.gal1 {grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 1;
grid-row-end: 2;
position:relative ;
}

.gal2 {grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 2;
grid-row-end: 3;
position:relative ;
}
.gal3 {grid-column-start: 2;
grid-column-end: 3;
grid-row-start: 3;
grid-row-end: 4;
position:relative ;
}

.r p{ font-size: 1.5rem;
}

.r h2{ font-size: 1.75rem;
}
.u table{
font-size: 1.5rem;
}
.descrip p{ font-size: 1rem;
}

.descrip  h2{ font-size: 1.25rem;
}
.table th,td{ font-size: 0.75rem;
}



 
/*-----------footer-----------*/

.follow1 {
padding-left:25%;

}
 .fo{
grid-gap: 5px;
grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
grid-template-areas:
". . a1 . . ."
". . a2 . . ."
". . a3 . . ."
". . a5 . . ."
". . a4 . . ."
". . a6 . . ."
;
}
 

.fo  a:hover {color: #1a0000;
font-weight: bold;
font-size: 120%;
}
.fo h1 {font-size: 130%;
padding-bottom:8%;
text-align: center;

}
.fo p {font-size: 100%;
font-weight: bold;
padding-bottom:6%;
text-align: center;

}
.fo  p:hover {
font-size: 100%;
}
 
}