/*
yellow FFBE28
*/

html{height: 100%;}
body{
   /*background-color: #DADADA;*/
    
   padding: 0px; margin: 0px; font-family: Tahoma; 
   font-size: 15px;
   font-family: 'Open Sans', sans-serif;
}
  
a{}
a:hover{}
em{font-style: normal;}

/*.wrapper{width: 1024px; margin: 0 auto;}*/
.header{ height: 100px; width: 100%; margin: 0px;
  background: rgba(169,3,41,1);
  background: -moz-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(169,3,41,1)), color-stop(44%, rgba(143,2,34,1)), color-stop(100%, rgba(109,0,25,1)));
  background: -webkit-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  background: -o-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  background: -ms-linear-gradient(top, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  background: linear-gradient(to bottom, rgba(169,3,41,1) 0%, rgba(143,2,34,1) 44%, rgba(109,0,25,1) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#6d0019', GradientType=0 );
  border-bottom: 2px solid #FFBE28;
}
.header .inner{ text-align: left;  }
.header #logo{width: 200px; float: left;}
.header #logo a img{padding: 36px 30px 25px 10px; }
.header #mainmenu{width: 800px; padding-top: 10px; float: right;}
.header #mainmenu ul{list-style: none;}
.header #mainmenu ul li{ display: inline; float: left; }
.header #mainmenu ul li a{ color: #ddd; display: block; padding: 5px; margin: 7px 12px 5px 12px; text-shadow: 0px 0px 6px #333;}
.header #mainmenu ul li:hover a, .header #mainmenu ul li.active a{ color: #FFBE28;  }

.subheader{width: 100%; padding: 0px;}
.subheader .slider1{ 
  height: 300px;
  background: red url('../images/slider1.jpg') no-repeat scroll 50% 50%;
  background-size: cover;
}
.subheader .slider2{ 
  height: 360px;
  background: red url('../images/slider2.jpg') no-repeat scroll 50% 50%;
  background-size: cover;
}

.subheader .slider_inside{ width: 1024px; margin: 0 auto; }
.subheader .slider_inside h1{ margin: 0px; padding: 30px; color: white; text-shadow: 2px 2px 10px #000; }
.subheader .slider_inside h2{ margin: 0px; padding: 30px; color: white; text-shadow: 2px 2px 10px #000; }

.steps{ text-align: center; 
background: rgba(255,190,40,1);
background: -moz-linear-gradient(top, rgba(255,190,40,1) 0%, rgba(245,208,128,1) 50%, rgba(255,190,40,1) 100%);
background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,190,40,1)), color-stop(50%, rgba(245,208,128,1)), color-stop(100%, rgba(255,190,40,1)));
background: -webkit-linear-gradient(top, rgba(255,190,40,1) 0%, rgba(245,208,128,1) 50%, rgba(255,190,40,1) 100%);
background: -o-linear-gradient(top, rgba(255,190,40,1) 0%, rgba(245,208,128,1) 50%, rgba(255,190,40,1) 100%);
background: -ms-linear-gradient(top, rgba(255,190,40,1) 0%, rgba(245,208,128,1) 50%, rgba(255,190,40,1) 100%);
background: linear-gradient(to bottom, rgba(255,190,40,1) 0%, rgba(245,208,128,1) 50%, rgba(255,190,40,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffbe28', endColorstr='#ffbe28', GradientType=0 );
}

.tryitbox{width: 100%; border-top: 2px solid white;}

.tryitbox .tryitinner{background-color: #FFBE28;}
.tryitbox .tryitinner form{width: 1024px; margin: 0 auto;}
.tryitbox .tryitinner form{ padding: 20px;}
.tryitbox .tryitinner form h3{ padding: 15px; display: inline; font-size: 25px; }
.tryitbox .tryitinner form #tryittext{ width: 40%; }
.tryitbox .tryitinner form #tryitbutton{  }

.mainbar{ 
  padding: 30px;
  background-color: #FFBE28;
  position: static;
}
.col1{ width: 49%; float: left;}
.col2{ width: 49%; float: right;}

.content{
  background: white url('../images/gd.png') repeat-x scroll 0px 2px;
}
.content .inner{ padding: 30px; }

.basket{}
  .item{ padding: 3px; border: 1px dashed gray; margin: 10px 3px 10px 3px;}
  .item .itembar{ padding: 5px 5px 5px 10px; line-height: 38px; font-size: 15px; height: 40px; background-color: #e1e1e1; }
  .item .submenu{text-align: right;}
  .item .font{width: 300px; float: left;}
  .item .color{width: 200px; float: left;}
  .item .content{ }
  .item .viewer_container{width: 100%; clear: both; text-shadow: 2px 2px 10px #999; padding: 50px; font-size: 30px;}

#orderform{}
#orderform .col1{width: 35%;}
#orderform .col2{width: 63%;}
#orderform .col1 label{width: 90px; display: inline-block; text-align: right; padding-right: 10px;}
#orderform .col2 label{width: 140px; display: inline-block; text-align: right; padding-right: 10px;}
#orderform .inputlong{width: 400px; }

#pismaform{}
#pismaform .col1{width: 40%;}
#pismaform .col2{width: 58%;}
#pismaform .col2 label{width: 150px; display: inline-block; text-align: right; padding-right: 10px;}
#pismaform .col2 input[type="text"]{   }
#pismaform .inputlong{width: 400px; }
#pismaform .mainbar .button{text-align: center; }
#pismaform .mainbar .itemtext{ display: block; padding: 10px; width: 90%; height: 120px; }  


.fontgallery{ margin: 10px auto 10px auto; width: 1020px;}
.fontgallery .fontitem{padding: 5px; width: 46%; margin: 1%; float: left; height: 150px; overflow: auto; border: 1px solid #ccc; border-radius: 5px;}
.fontgallery .fontitem.active{background-color: #FFDD8C;}
.fontgallery .fontitem:hover, .fontgallery .fontitem.active:hover{background-color: #ddd;}
.fontgallery .fontitem .fontbar{padding: 5px 5px 5px 10px; font-size: 15px; height: 40px; background-color: #e1e1e1;}
.fontgallery .fontitem .fontbar em{ line-height: 38px;}
.fontgallery .fontitem .fontbar .submenu{float: right;}
.fontgallery .fontitem .fontcontent{text-align: center; font-size: 30px; text-shadow: 2px 2px 10px #999; padding: 15px 10px 10px 10px; border-top: 1px solid #ccc; white-space: nowrap; }

/*input[type="submit"],*/
input[type="text"], input[type="number"],input[type="password"],input[type="file"], select,textarea{
  border-radius: 5px;
  border-color: #eee #ccc #ccc #eee;
  border-width: 1px;
  padding: 5px;
  font-size: 17px;
}
  

input[type="text"]:hover, input[type="text"]:focus,
input[type="file"]:hover,input[type="file"]:focus,input[type="submit"],
select:hover, select:focus,
input[type="submit"],label, select{ } /*  cursor: pointer;*/

#tomcv{ color: white; border: 0px solid white; position: absolute; top: 620px; text-align: left;}
#tomcv h2{text-align: center; margin: 0px; padding: 0px;}
#tomcv h2 span{display: none;}
#tomcv p{ font-family: 'Open Sans', sans-serif; font-size: 15px; margin: 0px; padding: 0px 350px 0px 140px; text-align: justify; color: silver;}

#clickable{ display: block; width: 400px; position: absolute; height: 200px; text-decoration: none;}
.boxik{ width: 100px; height: 100px; float: left; margin: 10px; float: left;}  
.boxik img{ width: 100px; height: 100px; border-radius: 4px;}
.inner{ width: 1000px; margin: 0px auto 0px auto; display: block; position: relative;}  

.cleaner{ clear: both;}


.prettybutton{ 
  padding: 5px 10px 5px 10px; 
  border-radius: 2px; 
  border-left: 1px solid #D30003;
  border-top: 1px solid #D30003;
  border-right: 1px solid black;
  border-bottom: 1px solid black;
  color: white;
  font-size: 15px;
  text-shadow: 1px 1px 3px #000;
  margin: 5px;
  cursor: pointer;
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#a90329+0,8f0222+49,6d0019+50,ad001c+100 */
background: #a90329; /* Old browsers */
background: -moz-linear-gradient(top,  #a90329 0%, #8f0222 49%, #6d0019 50%, #ad001c 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a90329), color-stop(49%,#8f0222), color-stop(50%,#6d0019), color-stop(100%,#ad001c)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top,  #a90329 0%,#8f0222 49%,#6d0019 50%,#ad001c 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top,  #a90329 0%,#8f0222 49%,#6d0019 50%,#ad001c 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top,  #a90329 0%,#8f0222 49%,#6d0019 50%,#ad001c 100%); /* IE10+ */
background: linear-gradient(to bottom,  #a90329 0%,#8f0222 49%,#6d0019 50%,#ad001c 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#ad001c',GradientType=0 ); /* IE6-9 */

}
.size_xl{ font-size: 20px; cursor: pointer;  border-radius: 4px; padding: 8px 15px 8px 15px; }
