html, body
    {
    width: 100%;
	height: 100%;
	padding: 0px;
	margin: 0px;
	}
#body	
	{
	/* body element has id #body*/
	/*background: url("../images/bg/rotate.php?img=23.jpg") left top #000;
    background: url("../images/bg/rotate.php") left top #000;
    */
	background-repeat:no-repeat;
	font-family: trebuchet MS;
    color: #fff;
    font-size: 12px;
	}
#content{
 color: #FFFFFF;
 width:660px;
}
#top1   {
	height: 20px;
    padding-right: 10px;
        }
        #topinner{
	height: 20px;
	/*width:660px;*/
	margin-left:auto;
	margin-right:auto;
        }
        #top1 a {
	widht: 100%;
        color: #fff;
	}
        #topnav {
        padding-top: 2px;
        margin-right: 50px;
        }

#header1 {
	widht: 100%;
	height: 190px;
	background: #1b1c1f;
}

#logo {
	margin-left:auto;
	margin-right:auto;
    background-image: url('../images/layout/logotumma.png');
	background-repeat:no-repeat;
	height: 160px;
    width: 800px;
}

.header1-content {
    margin: 0 auto;
    width: 750px;
    position: relative;
}

.site-logo {
    padding: 10px;
    position: relative;
    max-width: 510px;
    float: left;
}

.header-contact-details {
    float: left;
    margin: 26px 0 0 28px;
    text-align: center;
    font-size: 14px;
}

.header-contact-details, .header-contact-details p {
    color: #e0e0e0;   
}

.header-opening-hours {
    font-weight: bold;   
}

#menu1 {
    height: 30px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -29px;
    background: #ececec;
    margin-bottom: 20px
}

#menu1 a {
    font-size:18px;
    text-transform: uppercase;
}

#frame
	{
    /*width:990px;*/
	width:660px;
	height: auto;
	float: left;
	}
	#top
		{
        /*width:990px;*/
	    width:660px;
		height: 30px;
		float: left;
		text-align: right;
		color: #fff;
		line-height: 30px;
		font-size: 12px;
		}
		
	#header
		{
        /*width:990px;*/
	    width:660px;
		height: 54px;
		float: left;
        color: #FFFFFF;
		background: url(../images/layout/header.jpg) repeat-x;
		}
		#navigation
			{
			width: 960px;
            margin-left: auto;
            margin-right: auto;
			}
		#some
			{
			float: left;
            margin-left: 10px;
            margin-top: 8px;
			}
		#some a {
            text-decoration:none !important;
        }
.jouluesite {
    border: 0 none;
    float: right;
    margin: -10px 0 0 416px;
    position: absolute;
    z-index: 10;
   /*  transform:rotate(7deg);*/
   /*  -ms-transform:rotate(7deg); /* IE 9 */
   /*  -webkit-transform:rotate(7deg); /* Safari and Chrome */
    /* height: 160px;
    widht: 160px; */
    } 
.joulupaketit {
    border: 0 none;
    float: right;
    margin: -22px 0 0 255px;
    position: absolute;
    z-index: 10;
    }   
.joulupaketit2 {
    border: 0 none;
    float: right;
    margin: -72px 0 0 492px;
    position: absolute;
    z-index: 10;
    } 
    
.joulupaketit-otsikko {
    background: #eee;
    text-align: center;
    padding: 5px;
}

#content
	{
	width: 660px;
    height:auto;
	float: left;
/*	background: #000;*/
	/*div wrapping content area where template is called */
	}
    #transparent {
    background-image: url('../images/layout/transparent.png');
        min-height:480px;
        padding-bottom: 40px;
        }
	#footer
		{
		width: 660px;
		height: 38px;
		line-height: 38px;
		font-size: 12px;
		float: left;
		text-align: right;
		color: #fff;
		/* background: url(../images/layout/footer.jpg) repeat-x; */
		}
#eAdminContent{
	/* first div inside body in administration mode. */
	}

#topdiv{
	/* header area including #logo and #menuwrapper*/
	}
	


#menuwrapper{
	/* menu (customcontent #menu#) located inside this div, inside #topdiv with #logo */
	}
	
hr {
    border-color: #666;    
}

h1
	{
	color: #f2cb13;
	/*font-size: 75px;*/
	padding: 0;
	margin: 0 0 0 0;
	/*line-height: 16px;*/
    text-transform: uppercase;
	}
    .otsikko1
    {
	color: #f2cb13;
	font-size: 65px;
	padding: 0;
	margin: 0 0 0 0;
	/*line-height: 16px;*/
    text-transform: uppercase;
	}
h2
    {
    color: #f2cb13;
	font-size: 25px;
	padding-bottom: 20px;
	margin: 0 0 0 0;
	/*line-height: 16px;*/
    text-transform: uppercase;
	}
    .otsikko2 {
    color: #f2cb13;
    font-size: 40px;
	padding-bottom: 20px;
	margin: 20px 0 0 0;
	/*line-height: 16px;*/
    text-transform: uppercase;
	}
h3
	{
	color: #ffffff;
	font-size: 20px;
	padding: 0;
    margin: -10px 0 0 0;
	/*line-height: 14px;*/
    text-transform: uppercase;
    opacity: 0.7;
	}
    .otsikko3
    {
	color: #ffffff;
	font-size: 25px;
	padding: 0;
    margin: -10px 0 0 0;
	/*line-height: 14px;*/
    text-transform: uppercase;
    opacity: 0.7;
	}
h4
    {
	color: #ffffff;
	font-size: 20px;
	padding: 0;
	margin: 10px 0 10px 0;
	/*line-height: 14px;*/
    text-transform: uppercase;
    opacity: 0.7;
	}
   .otsikko4
    {
    color: #ffffff;
	font-size: 20px;
	padding: 0;
	margin: 10px 0 10px 0;
	/*line-height: 14px;*/
    text-transform: uppercase;
    opacity: 0.7;
	}
    h5
    {
    color: #fff;
    font-size: 18px;
	padding: 0;
	margin: 0 0 0 0;
	/*line-height: 16px;*/
	}
    .otsikko5
    {
    color: #fff;
    font-size: 18px;
    padding: 0;
	margin: 0 0 0 0;
	/*line-height: 16px;*/
	}	

p	{
	color: #fff;
	font-size: 16px;
	padding: 0;
	margin-bottom: 20px;
    margin-top: 0px;
	line-height: normal;
        /*text-transform: uppercase;*/
	}
#heittomerkki {
    margin: 30px auto;
	width:400px;
	}
#heittomerkkitaulukko {
    margin: 30px auto;
width: 380px;	}
#heittomerkkitaulukko2 {
    margin: 30px auto;
    width:280px;
    }
span.heittomerkki
    {
	/*color: #ffcc00;
	font-size: 18px;
	line-height:normal;
	font-family:"Courier New", Courier, monospace;*/
        color: #ffffff;
	font-size: 30px;
	padding: 0;
    margin: -10px 0 0 0;
	/*line-height: 14px;*/
    text-transform: uppercase;
    opacity: 0.7;
	}
span.heittomerkkitaulukko2
    {
    color: #ffffff;
	font-size: 22px;
	padding: 0;
    margin: -10px 0 0 0;
	/*line-height: 14px;*/
    text-transform: uppercase;
    opacity: 0.7;
	}
p, h1, h2, h3, h4, h5 {
        font-stretch:normal;
        }
span.newsitem_date
	{
	color: #ffcc00;
	font-size: 18px;
	padding: 0;
	margin: 0;
	line-height: 16px;	
	}
span.newsitem_subject {
	color: #ffcc00;
	font-size: 18px;
	padding: 0;
	margin: 0px;
	line-height: 16px;	
	}
    .newsfancy {
	color: #ffcc00;
	font-size: 18px;
	padding: 0;
	margin: 0px;
	line-height: 16px;	
	}
    .newsview_subject {
        font-size: 24px;
        color: #FFCC00;
        }
span.newsitem_shortcontent
	{
	color: #fff;
	font-size: 12px;
	padding: 0px 0px 10px 0px;
	margin: 80px;
	line-height: 16px;	
	}
a.newsitem_readmore
	{

	font-size: 12px;
	padding: 0;
	margin: 0;
	line-height: 16px;	
	text-decoration: none;
	}
.newsitem_container
	{
	margin: 0px 0px 10px 0px;
	}
a.newsitem_archive
	{
	font-size: 12px;
	padding: 0;
	margin: 0;
	line-height: 16px;	
	text-decoration: none;
	}
#top table tr td a
	{
	color: #fff;
	text-decoration: none;
	}
#content a
	{
	color: #ffff00;
	text-decoration: none;
font-size: 15px;
	}
#content a:hover
	{
	color: #ffff00;
	text-decoration: underline;
	}

a.mceText
	{
	color: #666 !important;
	}
div#fancy_inner
	{
	background-color:#222222;
    border:1px solid #fff;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
	}

span.registrationformerror{
color:#333;
}
#loginrequired a{
	 color: #FFFF00;
    text-decoration: none;
}

#fancy_outer {
overflow: visible;
width: 800px;
margin-left: auto;
    margin-right: auto;
}
#fancy_outer {
    height: 480px !important;
    width: 920px !important;
    left: 470px !important; 
    }
    
/*
 * Oma etiketti - I.S. 2016-09-27
 */
 

/* MailChimp Form Embed Code - Classic - 12/17/2015 v10.7 */
#mc_embed_signup form {display:block; position:relative; text-align:left; padding:10px 0 10px 3%}
#mc_embed_signup h2 {font-weight:bold; padding:0; margin:15px 0; font-size:1.4em;}
#mc_embed_signup input {border: 1px solid #ABB0B2; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px;}
#mc_embed_signup input[type=checkbox]{-webkit-appearance:checkbox;}
#mc_embed_signup input[type=radio]{-webkit-appearance:radio;}
#mc_embed_signup input:focus {border-color:#333;}
#mc_embed_signup .button {clear:both; background-color: #03a61b; border: 0 none; border-radius:4px; transition: all 0.23s ease-in-out 0s; color: #FFFFFF; cursor: pointer; display: inline-block; font-size:15px; font-weight: normal; padding: 10px; margin: 0 5px 10px 0; text-align: center; text-decoration: none; vertical-align: top; white-space: nowrap; width: 96%;}
#mc_embed_signup .button:hover {background-color:#027112;}
#mc_embed_signup .small-meta {font-size: 11px;}
#mc_embed_signup .nowrap {white-space:nowrap;}

#mc_embed_signup .mc-field-group {clear:left; position:relative; width:96%; padding-bottom:3%; min-height:50px;}
#mc_embed_signup .size1of2 {clear:none; float:left; display:inline-block; width:46%; margin-right:4%;}
* html #mc_embed_signup .size1of2 {margin-right:2%; /* Fix for IE6 double margins. */}
#mc_embed_signup .mc-field-group label {display:block; margin-bottom:3px; font-size: 16px;}
#mc_embed_signup .mc-field-group input {display:block; width:100%; padding:8px 0; text-indent:2%; font-size: 16px;}
#mc_embed_signup .mc-field-group select {display:inline-block; width:99%; padding:5px 0; margin-bottom:2px;}

#mc_embed_signup .datefield, #mc_embed_signup .phonefield-us{padding:5px 0;}
#mc_embed_signup .datefield input, #mc_embed_signup .phonefield-us input{display:inline; width:60px; margin:0 2px; letter-spacing:1px; text-align:center; padding:5px 0 2px 0;}
#mc_embed_signup .phonefield-us .phonearea input, #mc_embed_signup .phonefield-us .phonedetail1 input{width:40px;}
#mc_embed_signup .datefield .monthfield input, #mc_embed_signup .datefield .dayfield input{width:30px;}
#mc_embed_signup .datefield label, #mc_embed_signup .phonefield-us label{display:none;}

#mc_embed_signup .indicates-required {text-align:right; font-size:11px; margin-right:4%;}
#mc_embed_signup .asterisk {color:#e85c41; font-size:150%; font-weight:normal; position:relative; top:5px;}     
#mc_embed_signup .clear {clear:both;}

#mc_embed_signup .mc-field-group.input-group ul {margin:0; padding:5px 0; list-style:none;}
#mc_embed_signup .mc-field-group.input-group ul li {display: inline-block; text-align: center; padding:3px 0; margin:0;}
#mc_embed_signup .mc-field-group.input-group label {display:inline;}
#mc_embed_signup .mc-field-group.input-group input {display:inline; width:auto; border:none;}

#mc_embed_signup div#mce-responses {float:left; top:-1.4em; padding:0em .5em 0em .5em; overflow:hidden; width:90%; margin: 0 5%; clear: both;}
#mc_embed_signup div.response {margin:1em 0; padding:1em .5em .5em 0; font-weight:bold; float:left; top:-1.5em; z-index:1; width:80%;}
#mc_embed_signup #mce-error-response {display:none;}
#mc_embed_signup #mce-success-response {color:#529214; display:none;}
#mc_embed_signup label.error {display:block; float:none; width:auto; margin-left:1.05em; text-align:left; padding:.5em 0;}

#mc-embedded-subscribe {clear:both; width:auto; display:block; margin:1em 0 1em 5%;}
#mc_embed_signup #num-subscribers {font-size:1.1em;}
#mc_embed_signup #num-subscribers span {padding:.5em; border:1px solid #ccc; margin-right:.5em; font-weight:bold;}

#mc_embed_signup #mc-embedded-subscribe-form div.mce_inline_error {display:inline-block; margin:2px 0 1em 0; padding:5px 10px; background-color:rgba(255,255,255,0.85); -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; font-size:14px; font-weight:normal; z-index:1; color:#e85c41;}
#mc_embed_signup #mc-embedded-subscribe-form input.mce_inline_error {border:2px solid #e85c41;}

/* Custom settings by Hermanni */

#mc_embed_signup { color: #d9b456; }
.mc-field-group.input-group img { display: block; }
/* Dirty specifity war trick - use the same id twice */
#mc_embed_signup#mc_embed_signup li.christmas-label { margin-bottom: 30px; }
#mc_embed_signup strong { font-size: 16px; font-weight: bold }
#mc_embed_signup fieldset {margin: 20px 0px; border: 4px solid #d9b456; border-radius: 10px; background: #111111; }
#mc_embed_signup legend { font-size: 14px; font-size: 14px;  }
#mc_embed_signup .label-logo-instructions { color: #d4d4c7; }

#mc_embed_signup .minimum-amount-for-wines-instruction {
	text-align: center;
}

#mc_embed_signup #mce-success-response {
	color: black;
	display: none;
	background: #d9ce0f;
	padding: 10px;
	font-size: 16px;
	border-radius: 2px;
}

/* Tuotteiden sivupalkin linkit */

#contentarea_4 strong a {
    font-weight: normal;
    color: white;
}

#contentarea_4 strong a:hover {
    color: white;
    cursor: default;
    text-decoration: none;
}

/*
 * // Etusivu
 */

.featured-content {
    margin: 0 0 50px;
}

.featured-content flag__image {
    padding: 10px;   
}

#content .follow-us-in-some-title {
    padding: 5px;
    margin-bottom: 0;
    font-size: 19px;
    color: #f2cb13;
    opacity: 1.0;
    text-transform: none;   
}

#content .follow-us-in-some {
    margin: 40px 0 0 0;   
}

#content .follow-us-in-some ul {
    margin: 0px 0 0 0;
    padding: 0px;
    list-style-type: none;
}

#content .follow-us-in-some li {
    margin: 0 0 10px; 
    border-radius: 3px;
}

#content .follow-us-in-some a {
    width: 100%;
    display: block;
    font-size: 16px;
    color: white;
}

.we-are-in-facebook { background: #3b5998; }
.we-are-in-instagram { background: #125688; }

/* 
 * Instafeed
 */
 
#content .instagram-title {
    clear: both;
    text-align: center;
    margin: 20px 0px;
    background: #f2cb13;
    color: black;
    opacity: 1.0;
    padding: 8px;
 }
 
 #instafeed a {
    display: inline-block;
    margin: 10px;
 }
 
 #instafeed img {
    display: block;
    width: 182px;
    height: 182px;
 }

#content #load-more-instagram-images-button {
       margin: 10px auto;
       width: 200px;
       font-size: 16px;
       padding: 10px;
}

#content #load-more-instagram-images-button:hover {
    background: #307910;
}

#content #load-more-instagram-images-button:disabled {
    background: #eee;
    color: #666;
}

#content a.go-to-instagram-link {
    text-align: center;
    color: #fff;
    font-size: 12px;
    text-decoration: underline;
    display: block;
    padding: 5px;
}

#content a.go-to-instagram-link:hover {
    color: #aaa;   
}

 /*
  * // Oma etiketti
  */
  
/* CSS objects */

/* Button */

#content .button {
    display: block;
    padding: 10px;
    color: white;
    background-color: #61B33D;
    border-radius: 3px;
    text-align: center;
    margin: 10px;
    cursor: pointer;
    font-weight: bold;
    border: none;
}

#content .button.secondary {
    background-color: #444;
}

#content .button.secondary:hover {
    background-color: #333;
}

#content a.button:hover {
    color: white;
    background-color: #499926;
    text-decoration: none;
}

#content .button.large {
    font-size: 16px;
    padding: 15px 10px;
}

#content a.button {
    color:  white;
}

/**
 * Flag object.
 *
 * Very similar to the media object, only the flag object allows for vertical alignment.
 * stubbornella.org/content/2010/06/25/the-media-object-saves-hundreds-of-lines-of-code/
 */
 
.flag {
  display: table;
  width: 100%;
}

.flag__image,
.flag__body {
  display: table-cell;
  vertical-align: middle;
}
.flag--top .flag__image, .flag--top
.flag__body {
  vertical-align: top;
}
.flag--bottom .flag__image, .flag--bottom
.flag__body {
  vertical-align: bottom;
}

.flag__image {
  padding: 0px;
}
.flag__image > img {
  display: block;
  max-width: none;
}
.flag--rev .flag__image {
  padding-right: 0;
  padding-left: 10px;
}

.flag__body {
  width: 100%;
}

/* Panel */

.panel {
    border-radius: 3px;
    background: #fcd02f;
    background: -moz-linear-gradient(top, #fcd02f 0%, #d69d00 92%, #bd8b00 100%);
    background: -webkit-gradient(left top, left bottom, color-stop(0%, #fcd02f), color-stop(92%, #d69d00), color-stop(100%, #bd8b00));
    background: -webkit-linear-gradient(top, #fcd02f 0%, #d69d00 92%, #bd8b00 100%);
    background: -o-linear-gradient(top, #fcd02f 0%, #d69d00 92%, #bd8b00 100%);
    background: -ms-linear-gradient(top, #fcd02f 0%, #d69d00 92%, #bd8b00 100%);
    background: linear-gradient(to bottom, #fcd02f 0%, #d69d00 92%, #bd8b00 100%);
    font-weight: bold;
    padding: 10px;
    color: black;
}

.centered {
    text-align: center;   
}