/*
* Skeleton V2.0.4
* Copyright 2014, Dave Gamache
* www.getskeleton.com
* Free to use under the MIT license.
* http://www.opensource.org/licenses/mit-license.php
* 12/29/2014
*/


/* Table of contents
––––––––––––––––––––––––––––––––––––––––––––––––––
- Grid
- Base Styles
- Typography
- Links
- Buttons
- Forms
- Lists
- Code
- Tables
- Spacing
- Utilities
- Clearing
- Media Queries
*/

.box {
  position: absolute;  
  width: 100%;
  height: 100%;   
}

.kaire {  
  width:50% !important;
  height:100% !important;
  margin-right: 0% !important;
  background-image: url(images/kaire1.png);
  background-position:center left;
  background-size:cover; 
  background-repeat:no-repeat;
}

.desine {  
  width:50% !important;
  height:100% !important;
  margin-right: 0% !important;
  background-image: url(images/desine1.png);
  background-position:center right;
  background-size:cover; 
  background-repeat:no-repeat;
  background-color: #18b89e;
  color:#eae1d7;
}
.desine h1 {  
  color:#eae1d7;
}


.container {
  position: relative;
  width: 100%;
  text-align:center;
  top:33%; 
  /*max-width: 960px;*/
  max-width: 800px;
  margin: 0 auto;
  /*padding: 0 20px;*/
  box-sizing: border-box;
  padding: 0 15% 0 15%;
}


.details {
	font-size: 0.9em;
	font-weight:700;
	text-align:left;
	padding-bottom: 8px;
}
.details img {
	vertical-align:middle;
	padding-right:10px;
	/*float:left;*/
}
.details p {
	vertical-align:middle
	/*float:left;*/
	line-height:1.3;
	margin: 0 !important;
}

th, td {
    padding: 0px 0px !important;
    text-align: left;
}


  
.column,
.columns {
  width: 100%;
  float: left;
  box-sizing: border-box; }
.pasleptas{
  display:none;
}
.puse{
  width:50%;
}	

.one-third.column               { width: 100%; margin: 1.0% 0 1.0% 0%; padding: 4%; max-width: none;}
.one-third.column img           { width: 100% !important; max-width: 100% !important;}

.center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}
.title {
	color:#ffffff;
	text-align:center;
	padding:30px 30px 30px 30px;
	margin-top: 0px ;
    margin-bottom: 0px ;
}






  
/* For devices larger than 400px */
@media (min-width: 400px) {
  .container-rudas {
    width: 100%;
    padding: 0 4% 0 4%; 
  }
}

/* For devices larger than 550px */
@media (min-width: 550px) {
  .container-rudas {
    width: 100%;
	padding: 0 4% 0 4%;  
  }

}



@media (max-width: 800px) {  

  .logo {
	  /*padding-left:10%;
  	  padding-right:10%;*/
  }
  .box {
      background-image:none;
  }
  .backtop {
	  display:block !important;
  }
  .backbottom {
	  display:block !important;
  }
  .container {
	  
  }
  
  .house {
	  padding:0px 0 10px 0 !important; 
	  max-width: 100px !important;
  }
  
.kaire {  
  width:100% !important;
  height:50% !important;
  min-height:400px;
  background-image: url(images/kaire2.png);
  background-position:center right;
}

.desine {  
  width:100% !important;
  height:50% !important;
  min-height:400px;
  background-image: url(images/desine2.png);
  background-position:center left;
}

}





@media (min-width: 800px) {

  .container-rudas {
     padding: 10% 10% 0 10%; 
  }
  
 
  
  .puse{
	width:100%;
  }	
  .row {
     }	

  .column,
  .columns {
    margin-left: 4%; }
  .column:first-child,
  .columns:first-child {
    margin-left: 0; }

  .one.column,
  .one.columns                    { width: 4.66666666667%; }
  .two.columns                    { width: 13.3333333333%; }
  .three.columns                  { width: 24%;                margin-left: 0%; margin-right: 2%;}
  .four.columns                   { width: 30.6666666667%;     margin-left: 0%; margin-right: 2%;}
  .five.columns                   { width: 39.3333333333%; }
  .six.columns                    { width: 48%;                margin-left: 0%; margin-right: 2%;}
  .seven.columns                  { width: 56.6666666667%;     margin-left: 0%; margin-right: 2%;}
  .eight.columns                  { width: 65.3333333333%;     margin-left: 0%; margin-right: 2%;}
  .nine.columns                   { width: 74.0%;          }
  .ten.columns                    { width: 82.6666666667%; }
  .eleven.columns                 { width: 91.3333333333%; }
  .twelve.columns                 { width: 100%; margin-left: 0; }

  .one-third.column               { width: 30.6666666667%; margin: 1.0% 0.8% 1.0% 1.8%; padding: 0; max-width: 325px;}
  
  .two-thirds.column              { width: 65.3333333333%; }
  
  .one-fifth.column               { width: 17.3333333333%; font-size: 0.8em; margin-left: 2%; }
  .one-fifth.column p             { margin-top:10px; }  

  .one-half.column                { width: 48%; }

  /* Offsets */
  .offset-by-one.column,
  .offset-by-one.columns          { margin-left: 8.66666666667%; }
  .offset-by-two.column,
  .offset-by-two.columns          { margin-left: 17.3333333333%; }
  .offset-by-three.column,
  .offset-by-three.columns        { margin-left: 26%;            }
  .offset-by-four.column,
  .offset-by-four.columns         { margin-left: 34.6666666667%; }
  .offset-by-five.column,
  .offset-by-five.columns         { margin-left: 43.3333333333%; }
  .offset-by-six.column,
  .offset-by-six.columns          { margin-left: 52%;            }
  .offset-by-seven.column,
  .offset-by-seven.columns        { margin-left: 60.6666666667%; }
  .offset-by-eight.column,
  .offset-by-eight.columns        { margin-left: 69.3333333333%; }
  .offset-by-nine.column,
  .offset-by-nine.columns         { margin-left: 78.0%;          }
  .offset-by-ten.column,
  .offset-by-ten.columns          { margin-left: 86.6666666667%; }
  .offset-by-eleven.column,
  .offset-by-eleven.columns       { margin-left: 95.3333333333%; }

  .offset-by-one-third.column,
  .offset-by-one-third.columns    { margin-left: 34.6666666667%; }
  .offset-by-two-thirds.column,
  .offset-by-two-thirds.columns   { margin-left: 69.3333333333%; }
  
  .offset-by-one-fifth.column,
  .offset-by-one-fifth.columns    { margin-left: 20.6666666667%; }  

  .offset-by-one-half.column,
  .offset-by-one-half.columns     { margin-left: 52%; }
  
  
}



/* Base Styles
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/* NOTE
html is set to 62.5% so that all the REM measurements throughout Skeleton
are based on 10px sizing. So basically 1.5rem = 15px :) */
html {
  font-size: 62.5%; 
  }
body {
  font-size: 1.8em !important; /* currently ems cause chrome bug misinterpreting rems on body element */
  line-height: 1.5;
  font-weight: 400;
  font-family: "Mulish", sans-serif !important;
  font-optical-sizing: auto;
  
  height: 100%;
   
  color: #18b89e; 
  background-color: #eae1d7;
   
  /*background-image: url(img/fonas-zalias.jpg);*/
  
  margin:0;
  padding:0;
  }
   



/* Typography
–––––––––––––––––––––––––––––––––––––––––––––––––– */
h1, h2, h3, h4, h5, h6 {
  margin-top: 0;
  margin-bottom: 2rem;
  margin-left: 20px;
  margin-right: 20px;
  font-weight: 700 !important;
  color:#18b89e;
  font-family: "Mulish", sans-serif !important;
  font-optical-sizing: auto;
}
  
h1 { font-size: 3.2rem !important; line-height: 1.0 !important;  letter-spacing: -.1rem !important;}
h2 { font-size: 3.2rem; line-height: 1.0; letter-spacing: -.1rem; }
h3 { font-size: 2.8rem; line-height: 1.1;  letter-spacing: -.1rem; }
h4 { font-size: 2.4rem; line-height: 1.35; letter-spacing: -.08rem; }
h5 { font-size: 1.8rem; line-height: 1.5;  letter-spacing: -.05rem; }
h6 { font-size: 1.5rem; line-height: 1.6;  letter-spacing: 0; }

/* Larger than phablet */
@media (min-width: 550px) {

}

p {
  /*margin: 0 20px 10px 20px;*/
  text-align: left;
}


/* Links
–––––––––––––––––––––––––––––––––––––––––––––––––– */
a {
  color: #18b89e !important; 
  text-decoration:none !important;
}
a:hover {
  color: #18b89e !important; 
  text-decoration:none !important; 
}
a:visited {
  color: #18b89e !important; 
  text-decoration:none !important;
}


.mygtukas {
  display:block;
  width:30%;
  color: #fff; 
  background-color:#08ae62;
  padding: 20px;
  margin:auto;
}
.mygtukas:hover {
  background-color:#00a652;
}
.mygtukas a:hover {
	
}


/* Buttons
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.button,
button,
input[type="submit"],
input[type="reset"],
input[type="button"] {
  display: inline-block;
  height: 38px;
  padding: 0 30px;
  color: #555;
  text-align: center;
  font-size: 11px;
  font-weight: 600;
  line-height: 38px;
  letter-spacing: .1rem;
  text-transform: uppercase;
  text-decoration: none;
  white-space: nowrap;
  background-color: transparent;
  border-radius: 4px;
  border: 1px solid #bbb;
  cursor: pointer;
  box-sizing: border-box; }
.button:hover,
button:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
input[type="button"]:hover,
.button:focus,
button:focus,
input[type="submit"]:focus,
input[type="reset"]:focus,
input[type="button"]:focus {
  color: #333;
  border-color: #888;
  outline: 0; }
.button.button-primary,
button.button-primary,
input[type="submit"].button-primary,
input[type="reset"].button-primary,
input[type="button"].button-primary {
  color: #FFF;
  background-color: #33C3F0;
  border-color: #33C3F0; }
.button.button-primary:hover,
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover,
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
  color: #FFF;
  background-color: #1EAEDB;
  border-color: #1EAEDB; }


/* Forms
–––––––––––––––––––––––––––––––––––––––––––––––––– */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea,
select {
  height: 38px;
  padding: 6px 10px; /* The 6px vertically centers text on FF, ignored by Webkit */
  background-color: #fff;
  border: 1px solid #D1D1D1;
  border-radius: 4px;
  box-shadow: none;
  box-sizing: border-box; }
/* Removes awkward default styles on some inputs for iOS */
input[type="email"],
input[type="number"],
input[type="search"],
input[type="text"],
input[type="tel"],
input[type="url"],
input[type="password"],
textarea {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none; }
textarea {
  min-height: 65px;
  padding-top: 6px;
  padding-bottom: 6px; }
input[type="email"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="text"]:focus,
input[type="tel"]:focus,
input[type="url"]:focus,
input[type="password"]:focus,
textarea:focus,
select:focus {
  border: 1px solid #33C3F0;
  outline: 0; }
label,
legend {
  display: block;
  margin-bottom: .5rem;
  font-weight: 600; }
fieldset {
  padding: 0;
  border-width: 0; }
input[type="checkbox"],
input[type="radio"] {
  display: inline; }
label > .label-body {
  display: inline-block;
  margin-left: .5rem;
  font-weight: normal; }


/* Lists
–––––––––––––––––––––––––––––––––––––––––––––––––– */
ul {
  list-style: circle inside; }
ol {
  list-style: decimal inside; }
ol, ul {
  padding-left: 0;
  margin-top: 0; }
ul ul,
ul ol,
ol ol,
ol ul {
  margin: 1.5rem 0 1.5rem 3rem;
  font-size: 90%; }
li {
  margin-bottom: 1rem; }


/* Code
–––––––––––––––––––––––––––––––––––––––––––––––––– */
code {
  padding: .2rem .5rem;
  margin: 0 .2rem;
  font-size: 90%;
  white-space: nowrap;
  background: #F1F1F1;
  border: 1px solid #E1E1E1;
  border-radius: 4px; }
pre > code {
  display: block;
  padding: 1rem 1.5rem;
  white-space: pre; }


/* Tables
–––––––––––––––––––––––––––––––––––––––––––––––––– */
th,
td {
  padding: 12px 15px;
  text-align: left;
  border-bottom: 1px solid #E1E1E1; }
th:first-child,
td:first-child {
  padding-left: 0; }
th:last-child,
td:last-child {
  padding-right: 0; }


/* Spacing
–––––––––––––––––––––––––––––––––––––––––––––––––– */
button,
.button {
  margin-bottom: 1rem; }
input,
textarea,
select,
fieldset {
  margin-bottom: 1.5rem; }
pre,
blockquote,
dl,
figure,
table,
p,
ul,
ol,
form {
  margin-bottom: 2.5rem; }


/* Utilities
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.u-full-width {
  width: 100%;
  box-sizing: border-box; }
.u-max-full-width {
  max-width: 100%;
  box-sizing: border-box; }
.u-pull-right {
  float: right; }
.u-pull-left {
  float: left; }


/* Misc
–––––––––––––––––––––––––––––––––––––––––––––––––– */
hr {
  margin-top: 3rem;
  margin-bottom: 3.5rem;
  border-width: 0;
  border-top: 1px solid #E1E1E1; }


/* Clearing
–––––––––––––––––––––––––––––––––––––––––––––––––– */

/* Self Clearing Goodness */
.container-rudas:after, .container-tikrudas:after,
.row:after,
.u-cf {
  content: "";
  display: table;
  clear: both; }
  
  
  
  
  
  
  
  
/* MENU
–––––––––––––––––––––––––––––––––––––––––––––––––– */


.mobile-menu {	
 	display:block;  
	/*background: #8aa8bd;*/
	
	font-size: 0.9em;
	font-size: 16px;
	
	line-height: 20px;
	font-weight: 400;
	width:100%;
	text-align:right;
	position: relative;
  	margin:0 auto;
  	margin-top:20px;
}
/*Strip the ul of padding and list styling*/
.mobile-menu ul {
  list-style-type:none;
  margin: 0 auto;
  padding-left:0;
  text-align:right;
  width:100%;
  position: absolute;
}

/*Create a horizontal list with spacing*/
.mobile-menu li {
	display:inline-block;
	/*float: left;
	margin-right: 1px;*/

}

/*Style for menu links*/
.mobile-menu li a {
	display:block;
	/*min-width:140px;*/
	text-align: center;
	/*font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;*/
	font-weight:600;
	color: #333;
	background-color: transparent;
  	text-transform:uppercase;
	/*background: #8aa8bd;*/
	text-decoration: none;
  	margin: 0px 15px;
  	padding: 15px 0px 5px 0px;  
/*-webkit-transition: all 0.4s ease 0s;
-moz-transition: all 0.4s ease 0s;
-ms-transition: all 0.4s ease 0s;
-o-transition: all 0.4s ease 0s;
transition: all 0.4s ease 0s;*/
}

/*Hover state for top level links*/
.mobile-menu li:hover a {
	color: #1ebbf0;
  	background-color:#fff;
	background-image:none;
	border-bottom: 2px solid #1ebbf0;
}

/*Style for dropdown links*/
.mobile-menu li:hover ul a {
	background: transparent;
	color: #1ebbf0;
	height: 40px;
	line-height: 40px;
}

/*Hover state for dropdown links*/
.mobile-menu li:hover .mobile-menu ul a:hover {
	color: #4db3ff;
}

/*Hide dropdown links until they are needed*/
.mobile-menu li ul {
	display: none;
}

/*Make dropdown links vertical*/
.mobile-menu li ul li {
	display: block;
	float: none;
}

/*Prevent text wrapping*/
.mobile-menu li ul li a {
	width: auto;
	min-width: 100px;
	padding: 0 20px;
}


/*Style 'show menu' label button and hide it by default*/
.mobile-menu .show-menu {
	text-decoration: none;
	color: #333;
	/*background: #8aa8bd;*/
	text-align: center;
	padding: 10px 15px;
	display: none;
  	cursor: pointer;
  	text-transform: uppercase;
}

.mobile-menu .show-menu span{
   padding-left: 35px;
}

/*Hide checkbox*/
.mobile-menu input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
.mobile-menu input[type=checkbox]:checked ~ #menu{
    display: block;
}

  


/* Media Queries
–––––––––––––––––––––––––––––––––––––––––––––––––– */
/*
Note: The best way to structure the use of media queries is to create the queries
near the relevant code. For example, if you wanted to change the styles for buttons
on small devices, paste the mobile query code up in the buttons section and style it
there.
*/
@media screen and (max-width : 800px){
	h1 {
    	padding: 10px 0px 20px 0px !important;
	}

  .mobile-menu .lines {
    border-bottom: 12px double #333; 
    border-top: 4px solid #333; 
    content:"";
    height: 4px; 
    width:15px;
    padding-right:15px;
  	float: right;
	margin-bottom:36px;
	box-sizing: content-box;
}
	/*Make dropdown links appear inline*/
	.mobile-menu ul {
		position: static;
		display: none;	
		
	}
	/*Create vertical spacing*/
	.mobile-menu li {
		margin-bottom: 1px;			
	}
	/*Make all menu links full width*/
	.mobile-menu ul li, .mobile-menu li a {
		width: 100%;
		text-align:center;
		/*text-align:right;*/
	}
	.mobile-menu li a {
		background-color:transparent;	
		color:#333;
	}
	
	/*Display 'show menu' link*/
	.mobile-menu .show-menu {
		display:block;
	}
}








#headeris {
	margin-bottom:30px;
	margin-left:20px;
}

#row-zuvys {
	background-image:url(images/zydra-juosta.jpg); 
	background-repeat: no-repeat; 
	background-position:center center; 
	background-size: contain; 
	padding:0px 0px; 
	display: flex; 
	justify-content: center; 
	align-items: center;
	
	margin-bottom:0px;
}
#zuvyte {
	display:none;
}
.butonas{
	max-width: 100px;
	padding-top:30px;
}


/* Larger than mobile */
@media (min-width: 400px) {
	
  h1 { font-size: 3.2rem !important; }
  h2 { font-size: 3.2rem; }
  h3 { font-size: 3.0rem; }
  h4 { font-size: 3.0rem; }
  h5 { font-size: 2.4rem; }
  h6 { font-size: 1.5rem; }
  	

}

/* Larger than phablet (also point when grid becomes active) */
@media (min-width: 550px) {
.mobile-menu {	
  	margin-top:40px;
}
h1 { font-size: 3.3rem !important; }
h2 { font-size: 4.2rem; }
h3 { font-size: 3.5rem; }
}

/* Larger than tablet */
@media (min-width: 750px) {
body {
  font-size: 1.8em !important; /* currently ems cause chrome bug misinterpreting rems on body element */
}




	
h1 { font-size: 3.4rem !important; }
h2 { font-size: 4.3rem; }
h3 { font-size: 4.0rem; }
#row-zuvys {
	background-image:url(images/zydra-juosta.jpg); 
	background-repeat: no-repeat; 
	background-position:center center; 
	background-size: contain; 
	padding:0px 0px; 
	display: flex; 
	justify-content: center; 
	align-items: center;
	
	margin-bottom:0px;
}
#zuvyte {
	display:block;
}
.burb {
	max-width: 355px;
}
.butonas{
	max-width: 200px;
}

#rezeptwrap {
	padding: 20px 50px 20px 50px;
}

}

/* Larger than desktop */
@media (min-width: 1000px) {
body {
  font-size: 1.8em !important; /* currently ems cause chrome bug misinterpreting rems on body element */
}

h1 { font-size: 3.8rem !important; }
h2 { font-size: 4.3rem; }
h3 { font-size: 5.0rem; }
#headeris {
	margin-bottom:0px;
}
.burb {
	max-width: 255px;
}

}

/* Larger than Desktop HD */
@media (min-width: 1200px) {
body {
  font-size: 1.8em !important; /* currently ems cause chrome bug misinterpreting rems on body element */
}
p {
  margin: 0 0 20px 0;
}
h1, h2, h3, h4, h5, h6 {
  /*margin-left: 0;*/
}
h2 { font-size: 5.5rem; }
.burb {
	max-width: 310px;
}
}

/* Largest */
@media (min-width: 1400px) {
body {
  font-size: 1.8em !important; /* currently ems cause chrome bug misinterpreting rems on body element */
}

h2 { font-size: 6.0rem; }
.burb {
	max-width: 355px;
}
}