/* html5doctor.com Reset v1.6.1 - http://cssreset.com */
html,body,div,span,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,abbr,address,cite,code,del,dfn,em,img,ins,kbd,q,samp,small,strong,sub,sup,var,b,i,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,figcaption,figure,footer,header,hgroup,menu,nav,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;outline:0;font-size:100%;vertical-align:baseline;background:transparent}body{line-height:1}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}nav ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:none}a{margin:0;padding:0;font-size:100%;vertical-align:baseline;background:transparent}ins{background-color:#ff9;color:#000;text-decoration:none}mark{background-color:#ff9;color:#000;font-style:italic;font-weight:bold}del{text-decoration:line-through}abbr[title],dfn[title]{border-bottom:1px dotted;cursor:help}table{border-collapse:collapse;border-spacing:0}hr{display:block;height:1px;border:0;border-top:1px solid #ccc;margin:1em 0;padding:0}input,select{vertical-align:middle}

/*============================================================================*
        Basic setup
 *============================================================================*/

@font-face {
    font-family: 'ubuntu_titlingbold';
    src: url('fonts/UbuntuTitling-Bold-webfont.eot');
    src: url('fonts/UbuntuTitling-Bold-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/UbuntuTitling-Bold-webfont.woff') format('woff'),
         url('fonts/UbuntuTitling-Bold-webfont.ttf') format('truetype'),
         url('fonts/UbuntuTitling-Bold-webfont.svg#ubuntu_titlingbold') format('svg');
    font-weight: normal;
    font-style: normal;
}

html {
	height: 100%;
	background: #fbf4e2;
}
body {
	position: relative;
	min-height: 100%;
	/*height: 100%;*/
	font-family: Calibri, Tahoma, sans-serif;
	font-size: 10pt;
	color: #3c2415;
	line-height: 1.3;
	overflow-x: hidden;
	-webkit-text-stroke: 0.1px;
}

a, h1, h2, h3, h4, h5, h6 {
	color: #3c2415;
}

a {
	text-decoration: none;
}
a:hover {
	color: #aa703c;
	text-decoration: underline;
}

/*============================================================================*
        Header
 *============================================================================*/

#header {
	/*position: absolute;
	top: 0;
	left: 0;
	right: 0;*/
	position: relative;
	z-index: 3;
	max-width: 960px;
	width: 90%;
	margin: auto;
}

#logo img:hover {
	opacity: 0.75;
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
}

#nav {
	width: 100%;
	overflow: hidden;
}

#nav div.last {
	border: 0;
}

/*============================================================================*
        Content
 *============================================================================*/
#content {
	padding-bottom: 130px;
}

#wrapper {
	position: relative;
	z-index: 3;
	max-width: 960px;
	width: 90%;
	margin: auto;
	overflow: visible;
	border-radius: 10px;
	background: #eed1a2;
	text-align: center;
}
#wrapper > div {
	padding: 4%;
}

.article {
	position: relative;
	z-index: 8;
	border-radius: 10px 10px 0 0;
}
.article h1 {
	font-size: 160%;
	margin-bottom: 20px;
	font-weight: normal;
}
.article p {
	padding: 8px 0;
}

/*============================================================================*
        Slider
 *============================================================================*/
#slider {
	position: relative;
	border-radius: 0 0 10px 10px;
	text-align: center;
	white-space: nowrap;
	padding-top: 0;
}

#products {
	position: relative;
	overflow: hidden;
	height: 0;
}
#products li {
	display: inline-block;
	width: 29.6%;
	padding: 2%;
	visibility: hidden;
}

#products img {
	width: 80%;
	height: auto;
	background: #fbf4e2;
	border: 2px solid #E6CBAB;
	border-radius: 10px;
}
#product a {
	display: block;
}
#products span {
	display: block;
	font-family: 'ubuntu_titlingbold', Calibri, sans-serif;
	padding: 2px 0;
}
#products span.first {
	padding-top: 10px;
}
#products .read-more {
	border-top: 2px dotted #ad967a;
}

#left, #right {
	position: absolute;
	font-size: 140%;
	color: #aa703c;
	cursor: pointer;
	top: 0;
	display: none;
	z-index: 10;
	-webkit-transform: scaleY(2);  /* Saf3.1+, Chrome */
       -moz-transform: scaleY(2);  /* FF3.5+ */
        -ms-transform: scaleY(2);  /* IE9 */
        -o-transform: scaleY(2);  /* Opera 10.5+ */
        transform: scaleY(2);
}
#left { right: 95%; }
#right { left: 95%; }

#products:before, #products:after {
	content: ' ';
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	display: block;
	width: 40px;
	z-index: 5;
	background: -moz-linear-gradient(left,  rgba(238,209,162,1) 0%, rgba(255,255,255,0) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(238,209,162,1)), color-stop(100%,rgba(255,255,255,0))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(left,  rgba(238,209,162,1) 0%,rgba(255,255,255,0) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(left,  rgba(238,209,162,1) 0%,rgba(255,255,255,0) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(left,  rgba(238,209,162,1) 0%,rgba(255,255,255,0) 100%); /* IE10+ */
	background: linear-gradient(to right,  rgba(238,209,162,1) 0%,rgba(255,255,255,0) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#eed1a2', endColorstr='#00ffffff',GradientType=1 ); /* IE6-9 */
}
#products:after {
	left: inherit;
	right: 0;
	-moz-transform:rotate(180deg);
	-webkit-transform:rotate(180deg);
	-o-transform:rotate(180deg);
	-ms-transform:rotate(180deg);
	transform: rotate(180deg);
	filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=2);
}

/*============================================================================*
		Footer
 *============================================================================*/
#footer {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	width: 100%;
	height: 80px;
	background: #f3971f;
	color: #FFF;
	z-index: 12;
}
#footer > div {
	max-width: 960px;
	width: 90%;
	margin: auto;
}

#save-children {
	float: left;
}
#save-children > div {
	margin-top: 10px;
	height: 60px;
}
#save-children > div > div:first-child {
	border-right: 2px solid #FFF;
}
#save-children p {
	width: 200px;
	margin-top: 10px;
	font-weight: lighter;
	font-family: Myriad Pro, Calibri, Tahoma, sans-serif;
	font-size: 90%;
	letter-spacing: 0.2pt;
	padding-left: 15px;
}
#save-children img {
	width: 180px;
	margin-top: -8px;
	padding-right: 15px;
}

#social-links {
	float: right;
	height: 80px;
}
#social-links img {
	width: 40px;
}
#footer img:hover {
	opacity: 0.75;
	background-color: rgba(255,255,255,.01);
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
}


/*============================================================================*
		Background decorations
 *============================================================================*/
.decoration {
	position: fixed;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	/*z-index: 2;*/
    z-index: -2;

}
.decoration > div {
	position: relative;
	width: 50%;
	height: 100%;
}
.decoration.ground {
	position: absolute;
	top: inherit;
	bottom: 80px;
	z-index: 2;
}
.decoration.ground.zet {
	z-index: 10;
}


.decoration > div.right 	{	float: right; }
.decoration > div.left 	{	float: left; }
.decoration > div.right  .mbr	{ 	left: 0; 	text-align: right; }
.decoration > div.left .mbr		{ 	right: 0; 	text-align: left; }

 .mbr-fixed {
	position: absolute;
	z-index: -1;
	background-repeat: no-repeat;
	background-position: right top;
	padding: 0 !important;
}
.mbr-cloud {
	position: fixed;
	z-index: 1;
	background-repeat: no-repeat;
	background-position: right top;
}
 .mbr {
	position: absolute;
 }
.mbr:after {
	content: ' ';
	display: inline-block;
	background-repeat: no-repeat;
	background-position: right top;
}

/* Fixed with content */
#paukstis {
	background-image: url('./../images/bg/paukstis.png');
	top: -22px;
	right: -33px;
	width: 60px;
	height: 36px;
}
#drugelis1 {
	background-image: url('./../images/bg/drugelis1.png');
	top: 50%;
	left: -64px;
	width: 100px;
	height: 74px;
}
#balionas1 {
	background-image: url('./../images/bg/balionas1.png');
	top: 38%;
	right: -40px;
	width: 68px;
	height: 102px;
}

/* Fixed with scrollable background */
#saule {
	top: 2%;
	width: 90%;
	min-width: 650px;
}
#saule:after {
	background-image: url('./../images/bg/saule.png');
	width: 140px;
	height: 122px;

}

#balionas2 {
	top: 35%;
	width: 94%;
	min-width: 610px;
}
#balionas2:after {
	background-image: url('./../images/bg/balionas2.png');
	width: 72px;
	height: 127px;
	-webkit-animation:    lol 2s infinite; /* ! */
	-moz-animation:       lol 2s infinite; /* ! */
	-ms-animation:        lol 2s infinite; /* ! */
}

#drugelis2 {
	top: 58%;
	width: 85%;
	min-width: 560px;
}
#drugelis2:after {
	background-image: url('./../images/bg/drugelis2.png');
	width: 62px;
	height: 52px;
}

#rainbow {
	background-image: url('./../images/bg/rainbow.png');
	top: 20%;
	right:0;
	left: 0;
	background-size: 100%;
	width: 100%;
	height: 100%;
    z-index: -10;
}
#debesis1 {
	background-image: url('./../images/bg/debesis1.png');
	top: 1%;
	right:32%;
	width: 128px;
	height: 70px;
}
#debesis2 {
	background-image: url('./../images/bg/debesis2.png');
	top: 21%;
	right: 0;
	width: 106px;
	height: 84px;
}
#debesis3 {
	background-image: url('./../images/bg/debesis3.png');
	top: 26%;
	left: 4%;
	width: 123px;
	height: 68px;
}
#debesis4 {
	position: fixed;
	background-image: url('./../images/bg/debesis4.png');
	top: 60%;
	left: 6%;
	width: 88px;
	height: 36px;
}

#zeme1 {
	top: -189px;
	width: 100%;
	min-width: 720px;
	pointer-events: none;
}
#zeme1:after {
	background-image: url('./../images/bg/zeme1.png');
	width: 400px;
	height: 189px;
}
#zeme2 {
	top: -250px;
	width: 100%;
	min-width: 710px;
}
#zeme2:after {
	background-image: url('./../images/bg/zeme2.png');
	width: 1139px;
	height: 250px;
	margin-left: -1200px;
}

@-webkit-keyframes lol {
  0%, 100% {
    margin-top: 0;
    -webkit-transform: rotate(0deg);
  }
    50% {
    margin-top: 5px;
    -webkit-transform: rotate(2deg);
  }
}
@-ms-keyframes lol {
  0%, 100% {
    margin-top: 0;
    -webkit-transform: rotate(0deg);
  }
    50% {
    margin-top: 5px;
    -webkit-transform: rotate(2deg);
  }
}
@-moz-keyframes lol {
  0%, 100% {
    margin-top: 0;
    -webkit-transform: rotate(0deg);
  }
    50% {
    margin-top: 5px;
    -webkit-transform: rotate(2deg);
  }
}

/*============================================================================*
        Additional classes
 *============================================================================*/
.centered {
	display: table;
}
.centered > * {
	display: table-cell;
	vertical-align: middle;
}

.read-more {
	font-family: 'ubuntu_titlingbold', Calibri, sans-serif;
	color: #aa703c;
	font-size: 110%;
	font-weight: bold;
}

.clear:after {
	content: ' ';
	display: table;
	height: 0;
	clear: both;
}
/* ANDRIAUS */
.category { border: 1px solid #4c280d; width: 150px; height: 150px; margin-bottom: 5px; }
.category:hover { border: 1px solid #CF8A00; width: 150px; height: 150px; margin-bottom: 5px; }
.category-all { border: 1px solid #4c280d; width: 150px; height: 150px; margin-bottom: 5px; margin-top: 15px; }
.category-all:hover { border: 1px solid #CF8A00; width: 150px; height: 150px; margin-bottom: 5px; margin-top: 15px; }
.packaging { border: 1px solid #4c280d; width: 185px; height: 155px; margin-right: 17px; margin-left: 17px; }
.packaging:hover { border: 1px solid #CF8A00; width: 185px; height: 155px; margin-right: 17px; margin-left: 17px; }
.article h2 { font-size: 16px; font-weight: bold; margin-bottom: 7px; margin-top: 7px; }
.article h3 { font-size: 14px; font-weight: bold; margin-bottom: 7px; margin-top: 7px; }
.article .price { font-size: 14px; font-weight: bold; margin-bottom: 5px; }
.justified { text-align: justify; text-justify: newspaper; margin-left: 12px; margin-right: 12px;}
.inventory {
	border-radius: 3px;
	font-family: Myriad Pro, Calibri, Tahoma, sans-serif;
	margin-bottom: 5px;
}
.add-to-cart {
	margin-bottom: 3px;
}

/* RESPONSIVE 2015 11 15 */


.clear {
    clear: both;
}

.hidden {
    display: none;
}

/* MEDIA QUERIES*/


@media only screen and (min-width: 1px) {

    /* HEADER */
    #logo a {
        display: block;
        width: 100%;
        padding: 20px 0;
        max-width: 260px;
        margin: 0 auto;

    }
    #logo img {
        width: 100%;
        height: auto;
    }
    .conditions-image {
        width: 50%;
        float: left;
        display: block;
    }
    .conditions-image a {
        margin: 0 auto;
        display: block;
        /*width: 115px;*/
        width: 100%;
        text-align: center;
    }
    .conditions-image:nth-child(2) img{
        margin-left: 35px;
    }
    .conditions-image:nth-child(3) img{
        margin-left: 39px;
    }
    /* ENDHEADER */

    /* NAV */
    .nav-toggle-container {
        z-index: 10;
    }
    #nav {
        z-index: 10;
        max-width: 960px;
        margin: 0 auto;
        margin-bottom: 25px;
    }
    #nav div {
        height: 40px;
        width: 100%;
        float: left;
        display: table;
        margin-left: 2px;
        padding: 1px 4px;
        font-family: 'ubuntu_titlingbold', Calibri, sans-serif;
        font-size: 110%;
        font-weight: bold;
        text-align: center;
        line-height: 1.1;
        z-index: 10;
    }
    #nav div a {
        /*padding-top: 15px;*/
        position: relative;
        top: 12px;

    }
    /* ENDNAV */

    .products-container {
        width: 100%;
        display: block !important;
    }

    .certificate-img {
        width: 100%;
        max-width: 640px;
    }

    /*.decoration {*/
        /*display: none;*/
    /*}*/

    .justified {
        text-align: center;
    }

    .paypal-product {
        width: 100%;
        float: left;
    }

}
@media only screen and (min-width: 480px) {


    /* NAV */

}

@media only screen and (min-width: 670px) {


    /* NAV */
    #nav div {
        width: 12.5%;
        border-right: 2px dotted #ad967a;
        margin-left: 2px;
        padding: 1px 4px;
        font-size: 110%;
        line-height: 1.1;
    }
    /*ENDNAV*/


    .justified {
        text-align: justify;
    }

}

@media only screen and (min-width: 768px) {

    #header #logo{
        width: 30%;
        float: left;
    }
    #header #conditions {
        width: 70%;
        float: left;
        padding-top: 20px;

    }
    #conditions .conditions-image {
        width: 25%;
        float: left;
    }
    #logo a {
        display: block;
        width: 100%;
        padding: 20px 0;
    }
    #logo img {
        width: 100%;
        height: auto;
    }

    /*PRODUCTS*/


    .product {
        width: 50%;
        float: left !important;
        height: 435px;
    }

    .paypal-product {
        width: 50%;
        height: 350px;
    }
    /*ENDPRODUCTS*/

}

@media only screen and (min-width: 960px) {

    .product {
        width: 24%;
        height: 100%;
    }
    .product:nth-child(2){
        width: 28%;
    }

    .paypal-product {
        width: 33%;
    }


}

@media all and (max-width: 700px) {
    #nav div { font-size: 90%; }
}

@media all and (max-width: 700px) {
    .decoration.ground { bottom: 150px; }
}

@media all and (max-width: 700px) {
    #footer { height: 150px; }
    #footer > div > div { float: none; margin: auto; }
    #footer > div > div > div {  margin-left: auto;  margin-right: auto; }
}

@media all and (max-width: 700px) {
    /*#products li { width: 46.6%; }*/
}

@media all and (max-width: 700px) {
    #content { padding-bottom: 200px; }
}

@media all and (max-width: 1000px) {
    body { font-size: 9.5pt; }
}
@media all and (max-width: 700px) {
    body { font-size: 9pt; }
}
