@font-face {
  font-family: OpenSans;
  src: url(/fonts/OpenSans-Regular.ttf);
}

@font-face {
  font-family: OpenSans;
  src: url(/fonts/OpenSans-Bold.ttf);
  font-weight: bold;
}

@font-face {
  font-family: OpenSans;
  src: url(/fonts/OpenSans-Italic.ttf);
  font-style: italic;
}

@font-face {
  font-family: OpenSans;
  src: url(/fonts/OpenSans-BoldItalic.ttf);
  font-weight: bold;
  font-style: italic;
}

@font-face {
    font-family: "RobotoRegular";
    src: url("/fonts/RobotoRegular.eot");
    src: url("/fonts/RobotoRegular.eot?#iefix")format("embedded-opentype"),
    url("/fonts/RobotoRegular.woff") format("woff"),
    url("/fonts/RobotoRegular.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "RobotoLight";
    src: url("/fonts/RobotoLight.eot");
    src: url("/fonts/RobotoLight.eot?#iefix")format("embedded-opentype"),
    url("/fonts/RobotoLight.woff") format("woff"),
    url("/fonts/RobotoLight.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "RobotoMedium";
    src: url("/fonts/RobotoMedium.eot");
    src: url("/fonts/RobotoMedium.eot?#iefix")format("embedded-opentype"),
    url("/fonts/RobotoMedium.woff") format("woff"),
    url("/fonts/RobotoMedium.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}
@font-face {
    font-family: "RobotoBold";
    src: url("/fonts/RobotoBold.eot");
    src: url("/fonts/RobotoBold.eot?#iefix")format("embedded-opentype"),
    url("/fonts/RobotoBold.woff") format("woff"),
    url("/fonts/RobotoBold.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}

/*
@font-face {
    font-family: "ComfortaaRegular";
    src: url("../fonts/ComfortaaRegular.eot");
    src: url("../fonts/ComfortaaRegular.eot?#iefix")format("embedded-opentype"),
    url("../fonts/ComfortaaRegular.woff") format("woff"),
    url("../fonts/ComfortaaRegular.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}

@font-face {
    font-family: "ComfortaaLight";
    src: url("/fonts/ComfortaaLight.eot");
    src: url("/fonts/ComfortaaLight.eot?#iefix")format("embedded-opentype"),
    url("/fonts/ComfortaaLight.woff") format("woff"),
    url("/fonts/ComfortaaLight.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}*/

@font-face {
    font-family: "ComfortaaBold";
    src: url("/fonts/ComfortaaBold.eot");
    src: url("/fonts/ComfortaaBold.eot?#iefix")format("embedded-opentype"),
    url("/fonts/ComfortaaBold.woff") format("woff"),
    url("/fonts/ComfortaaBold.ttf") format("truetype");
    font-style: normal;
    font-weight: normal;
}



TD.menu {
	padding: 0px 40px 0px 40px;
	white-space: nowrap;
	cursor: pointer;
	position: relative;
}

TD.topmenu {
  
height: 0%; 
background: #45b39d;

}


div.dropmenu { visibility: hidden; display: none; position: absolute; top: 36px; left: 30px; border-top: 3px solid #f0c74a; min-width: 170px; padding: 0px; background-color: #ebebeb;  z-index: 100; text-align: left; opacity: 0.95}

TD.menu:hover div.dropmenu { visibility: visible; display: block;  }

div.dropmenu a {COLOR: #555555; font-weight: normal; font-size: 13px; display:block; padding: 5px; text-decoration: none; }
div.dropmenu a:hover {COLOR: white; background-color: #cfcfcf; text-decoration: none;}

html { height: 100%; min-height: 100%; margin:0px; padding:0px}

body {COLOR: #000000; font-family: RobotoRegular, OpenSans, Verdana, Arial, Helvetica; font-size: 13px; height:100%; min-height: 100%; margin: 0px; padding:0px; background-color: #ffffff; }
table {COLOR: #6d6e71;  font-size: 13px; }

a {COLOR: #45b39d; font-weight: normal; text-decoration: underline; }
a:hover {COLOR: #45b39d; font-weight: normal; text-decoration: none; }

a.sub {COLOR: #45b39d; font-size: 14px; font-weight: normal; text-decoration: none; }
a.sub:hover {COLOR: #45b39d; font-size: 14px; font-weight: normal; text-decoration: none; }

p {COLOR: #000000; text-align: left;  font-size: 13px; margin: 15px 5px 15px 5px; line-height: 1.5;}

p.galery {text-align: center; font-weight: bold;   font-size: 10px; margin: 2px 2px 2px 2px; }

p.j {COLOR: #000000; text-align: justify;  font-size: 14px; margin: 10px 5px 10px 5px; line-height: 1.5;}
p.l {COLOR: #45b39d; text-align: left;  font-size: 14px; font-weight: bold; margin: 10px 5px 10px 5px; line-height: 1.5; }
p.c {COLOR: #45b39d; text-align: center; font-size: 16px; font-weight: bold; margin: 15px 5px 15px 5px; line-height: 1.5; }
p.r {COLOR: #45b39d; text-align: right;  font-size: 13px; font-style: italic; margin: 10px 5px 10px 5px; line-height: 1.5;}

a.menumain {COLOR: #FFFFFF; font-weight: normal; font-size: 14px;  text-decoration: none; text-transform: uppercase; }
a.menumain:hover {COLOR: #F0FFF0; font-size: 14px; font-weight: normal; text-decoration: none; text-transform: uppercase;}

a.menumaina {COLOR: #F0FFF0; font-weight: normal; font-size: 14px; text-decoration: none; text-transform: uppercase; }
a.menumaina:hover {COLOR: #F0FFF0; font-size: 14px; font-weight: normal; text-decoration: none; text-transform: uppercase; }

a.menu2 {COLOR: #000000; font-size: 13px; text-decoration: none; line-height: 1.2; }
a.menu2:hover {COLOR: #45b39d; font-size: 13px; text-decoration: none; line-height: 1.2; }

a.menu2a {COLOR:#45b39d; font-size: 13px; text-decoration: none; line-height: 1.2;  }
a.menu2a:hover {COLOR: #45b39d; font-size: 13px; text-decoration: none; line-height: 1.2; }

a.menu3 {COLOR: #46b49e; font-size: 13px; text-decoration: none; }
a.menu3:hover {COLOR: black; text-decoration: underline; }

a.menu4 {COLOR: #46b49e; font-size: 15px; text-decoration: none; font-weight: bold;}
a.menu4:hover {COLOR: black; text-decoration: underline; }

a.white {COLOR: white; font-size: 13px; text-decoration: none; font-weight: bold;}
a.white:hover {COLOR: white; text-decoration: underline; }

a.white2 {COLOR: white; font-size: 12px; text-decoration: none; }
a.white2:hover {COLOR: white; text-decoration: underline; }



a.pages { COLOR: #FF0000; font-size: 10px; text-decoration: underline; font-weight: normal; }
a.pages:hover { COLOR: #FF0000; font-size: 10px; text-decoration: none; font-weight: normal; }

a.nav { font-size: 12px; text-decoration: none; }
a.nav:hover { font-size: 12px; text-decoration: underline; }

p.small {margin: 0px 20px;}

a.small { color: #383838; font-size: 11px; text-decoration: none; }
a.small:hover { font-size: 11px; text-decoration: underline; }


div.orderbannermain {overflow: hidden; position: relative;  width: 1000px; height: 180px; margin: 0px;  }
div.orderbanner {width: 178px; height: 160px; margin: 10px 0px 10px 0px; background-color: white; border: 1px solid #d9b3d4; padding: 0px;  float: left; color: #d9b3d4; font-size: 12px; box-shadow: inset 0 0 40px 2px rgba(217, 179, 212, 0.75);}
div.orderbannerarrow {width: 25px; height: 25px; margin: 70px 0px 0px 0px; float: left}

div.orderbanner p {COLOR: #d9b3d4; text-align: center;  font-size: 13px; margin: 0px 10px 10px 5px; line-height: 1;}


ul {margin: 10px 0px 0px 25px; padding: 0px 0px 0px 2px}
li { COLOR: #806080; text-align: left;  font-weight: normal; font-size: 12px; margin: 0px 0px 0px 15px; }


div.pages {COLOR: #000000; text-align: right;  font-size: 10px; margin: 2px 2px 8px 2px; font-weight: bold;}

div.gray1 {COLOR: #808080; text-align: left;  font-size: 10px; margin: 0px 0px 0px 0px; float: left; width: 300px; }
div.gray2 {COLOR: #808080; text-align: right;  font-size: 10px; margin: 0px 0px 0px 0px; float: right; width: 300px; }

img.section { border-style: none; border-width: 0px; border-color: #ffffff; }

img.gal { border-style: solid; border-width: 5px; border-color: #d1d3d4; }

img.roundedimage { border: 2px solid #f0c74a; }

img.roundedimage1 { border: 2px solid #f0c74a;  margin: 2px; }
img.roundedimage2 { border: 2px solid #f0c74a;  margin: 2px; }



#roadmap {

background: white;
width: 200px;
height: 130px;
border-top: 2px solid #efc74b;
border-bottom: 2px solid #efc74b;
margin: 20px 0px;

}

#roadmap2 {

width: 200px;
height: 45px;
margin: 0px;

}


#roadmapcontainer {

margin: 25px auto;
width: 180px;
height: 75px;
padding: 0px;

}

#roadmapcontainer2 {

margin: 0px;
width: 200px;
height: 45px;
padding: 0px;

}


div.roadmappoint {

width: 45px;
float: left;
margin: 10px 0px 0px 0px;

}

div.roadmappoint img {
  
border-radius: 25px;
  
}  

div.roadmappoint img:hover {

filter: invert(100%); 
-webkit-filter: invert(100%);


}


div.roadmappoint2 {

width: 50px;
float: left;
margin: 10px 0px 0px 0px;

}

div.roadmappoint2 img {
  
border-radius: 25px;
  
}  

div.roadmappoint2 img:hover {


filter: invert(100%); 
-webkit-filter: invert(100%);


}



div.articles {

background: white;
width: 200px;
margin: 20px 0px;

}










HR {
   color:            #e21c47;
   background-color: #e21c47;
   height:           1px;
   border-width:     0px;
   padding:          0px;
   margin:           10px 0px 10px 0px;
   width:            99%; 		
}


HR.articles {
   color:            #a0a0a0;
   background-color: #a0a0a0;
   height:           1px;
   border-width:     0px;
   padding:          0px;
   margin:           10px 0px 10px 0px;
   width:            99%; 		
}



h1 {
        font-family: RobotoMedium, OpenSans, Verdana, Arial, Helvetica;	
        COLOR: black;
	font-size: 30px; 
   	margin: 0px 0px 10px 0px;
	font-weight: normal;
	text-align: left;

    }

  


h2 {
	COLOR: black;
	font-size: 18px; 
	font-weight: normal;
	margin: 20px 0px 5px 0px;

}	


h3 {
	COLOR: #636363;
	font-family: RobotoBold, OpenSans, Verdana, Arial, Helvetica;
	font-size: 13px; 
	font-weight: normal;
	letter-spacing: 0.2em;
   	margin: 0px 0px 10px 0px;
	text-align: left;
	text-transform: uppercase;
	}

h4 {
	COLOR: #45b39d;
	font-family: RobotoMedium, OpenSans, Verdana, Arial, Helvetica;
	font-size: 15px; 
	font-weight: normal;
	text-align: center;
	text-transform: uppercase;
   	margin: 5px 0px;
    }

.mobilemenu{
 list-style:none;
 margin:0;
 padding:10px;
}
 
.mobilemenu li a{
 display:block;
 padding:5px;
 color: #ffffff;
 background-color: #45b39d;
 text-transform: uppercase;
 text-decoration: none;
}

ul.mobilemenu {
 margin:0px;
 padding:0px;
}


.mobilemenu li{
 margin:1px;
 float:left;
}


div.floatgal {

max-width: 40%;  
float: left;
margin: 5px;
  
}

#mobilepanel {

background-color: #45b39d;
width: 100%;
overflow: visible;
margin: 0px 0px 10px 0px;
padding: 5px 0px 5px 0px;
transition: 0.5s;

}

#mobilepanel a{
 color: #ffffff;
 margin: 5px;
}

#closemobilepanel { float: right; margin: 0px 10px 0px 0px; }

#closemobilepanel a {
 text-decoration: none;
}


@media screen and (max-width: 40.5em) {
  
  body {COLOR: #000000; font-family: RobotoRegular, OpenSans, Verdana, Arial, Helvetica; font-size: 13px; margin: 5px; padding:0px; background-color: #ffffff; background-image: none; }
  
  img.gal1 {
    max-width: 100%;
  }
  
  img.smallimage {
    max-width: 50%;
  }
  
  
  img.bigimage {
    max-width: 90%;
  }
  
  img {
    max-width: 90%;
  }
  
  h1 {
	text-align: center;
    }

  h2 {
	text-align: center;
    }
    
  
  
}