/**********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************




      YOU DONT NEED THIS CSS FILE FOR YOUR ENDPRODUCT !

	USED ONLY FOR THE DEMOS AND TOOLS HERE IN THIS FOLDER

				TO SHOW THE EXAMPLES.




***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************
***********************************************************/


























































/**********************************************************
					-	RESET	-
***********************************************************/
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
    margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;
        -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

 * {
/*	 -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -o-user-select: none;
*/
}

.toolpad * {
	 -moz-user-select: none;
        -khtml-user-select: none;
        -webkit-user-select: none;
        -o-user-select: none;
}

.clearfix {   
    clear:both; 
    width:100%;
    display: block;
}

/***********************
	-	BASICS 	-
***********************/

html {   
    font-family: "Roboto",sans-serif;
}

body {
    color: #6f7c82;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 26px;
}
.content {  
    max-width:1240px; 
    margin:auto;     
}

p { 
    color: #6f7c82;
    font-weight: 400;
    font-family: 'Roboto', sans-serif;
    font-size: 16px;
    line-height: 26px;
    overflow-x: hidden;
}

.content p,
.content a  {   text-decoration:none; }

h1 {   
    line-height:60px;
    font-size: 50px;
    pading:5px 15px;    
}

h2  {       
        font-size: 33px;
        line-height: 45px;
        font-weight: 500;
        color:#292e31;
    }

label   {
    color:#fff600;
    font-size:15px;
    font-weight:200;
    line-height:40px;
    margin-right:25px;
    min-width:150px;
    display: inline-block;
    text-align: left;
}

.small-history  {   text-align: center; margin: auto; margin-top:50px; margin-bottom:50px; max-width:760px;}
.header,
.footer {   
    line-height:50px;
    z-index: 300;
    position: relative;
}



.logo  {   
    background-image:url(../images/logo.png);
    display:block;
    width:211px;  height: 38px;margin-top:10px;
	margin-left: 30px;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: left center;
}
.button  {   
    background:#fff600;     
    color:#000; 
    font-weight: 400;
    font-size:18px;
    text-decoration: none; 
    line-height: 50px; 
    margin:0px; 
    display: block; 
    padding:0px 20px;
 	transition: color 0.2s;
     -webkit-transition: color 0.2s;
}


a.button i {
	font-size: 36px;
  font-weight: normal;
  position: relative;
  top: 10px;
  color:#000;
  margin-right: 7px;
  transition: color 0.2s;
     -webkit-transition: color 0.2s;
}

.button:hover {
	background: #000;
	color:#fff600;
}

a.button:hover i {
	color:#fff600;
}


.tp-infoicon i {
    color: rgba(33,42,64,0.5);
    background-color: rgba(0, 0, 0, 0);
    font-size: 20px;
    border: 2px solid rgba(33,42,64,0.05);
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    width: 100%;
    height: 40px;
    line-height: 37px;
    text-align: center;
    margin: 0 !important;
    -webkit-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
    -moz-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
    -o-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
    -ms-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out;
}

.tp-infoicon {
    position: relative;
    display: inline-block;
    text-align: center;
    width: 40px;
    height: 40px;
    margin: 0;
}

.textaligncenter {
    text-align: center;
}

.tp-smallinfo {
    color: rgba(33,42,64,0.5);
    margin-bottom: 10px;
    position: relative;
    display: block;
    font-weight: 500;
    font-size: 18px;
    margin-top:25px;
}

[class*=" md-"], [class^=md-] {
display: inline-block;
    font: normal normal normal 14px/1 'Material Design Iconic Font';
    font-size: inherit;
    speak: none;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.tp-headicon {
    color: #fff;
    font-size: 40px !important;
    line-height: 60px !important;
    background: #d50000;
    width: 60px;
    height: 60px;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    margin-bottom: 20px;
}

/* 
    Further Demo Content Styling - can be ignored for your project 
*/

.history            {   font-size:16px;  font-weight:400; padding:95px 30px 80px; text-align: center; max-width: 1240px; box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box; margin:auto;}
.history p          {   font-weight: 400; font-size: 16px; color:#3f4549;}
p.history_count      {   color:#fff;font-size:33px; background:#000; display:inline-block; width:40px;height:40px;line-height: 40px; font-weight: 400; margin:0px 0px 10px;}
.history_title      {   font-size:33px; font-weight:500; margin:0px 0px 40px; color:#000;}

.history a          {   color:#000; background: #fff600; text-decoration: none;}

.history a:hover     {   background:#000; color:#fff600;}

hr                  {   width:90px;height:2px;background:#ddd;border:none;  margin:60px auto;}




.example-table  {   background:#f5f7f9; padding:50px; border-top: 1px solid #e8ebee;
                     border-bottom: 1px solid #e8ebee;}

.filter             {   display:block; float:left; width:20%; text-align:right;}
.example-list       {   
display: inline-block;
width: 80%;
padding: 0px 0px 0px 50px;
float: right;
box-sizing: border-box;}


.filter ul, .filter li {
list-style:none;
}


.filter li{
color: rgba(41,46,49,0.5);
margin-right: 5px;
cursor: pointer;
padding: 0px 15px 0px 10px;
line-height: 25px;
font-size: 16px;
font-weight: 700;
font-family: "Roboto",sans-serif;
display: inline-block;
background: rgba(0, 0, 0, 0);
margin-bottom: 5px;
width: 100%;
display: block;
cursor: pointer;
}

.filter li:hover,
.filter li.selected {  color:#000;  }


.example-list .img-wrapper{
display:block;
vertical-align:top;             
margin:0px 15px 15px 0px;
float:left;
position:relative;
box-sizing:border-box;
}


.example-list img { display:block;vertical-align:top;width:100%;}


.hover-cover    {   color: #6f7c82;
font-weight: 400;
font-family: 'Roboto', sans-serif;
font-size: 16px;
line-height: 26px; opacity:0; 
visibility:hidden; position:absolute;top:5%;left:5%;width:90%;height:90%; background:#fff; padding:20px; box-sizing:border-box;  text-align:center;
                                text-transform: uppercase;
}


footer  {   
background:#2d3032; width:100%; padding:50px 150px; box-sizing:border-box; color:#fff;}

footer h3   {   color:#b7bdc0;font-size: 17px;
    line-height: 20px;
    font-weight: 700;
    letter-spacing: 0px;
    margin-bottom: 19px;}

footer, footer a {  

    color: rgba(183,189,192,0.5);
    font-weight: 500; 
    cursor:pointer;
}

footer a    {   display:block; text-decoration: none;}

footer a:hover  {   color:#fff;}

.footer_inner   {   max-width:1240px; margin:auto;}

.footerwidget   {   width:25%; padding:0px 20px; box-sizing:border-box; float:left;}


.bottom-history {
      /* display:table-cell;*/
        min-width:0px;box-sizing:border-box;padding:50px 25px !important; margin:0px auto !important; width:100%; max-width:none !important;
}

.bottom-history p { max-width:760px; margin:auto;}

.bottom-history-wrap    {  
/* display:table;*/
}

.bottom-history a,
.bottom-history a:visited { text-decoration: none !important; color:#d50000; font-weight: 700;}

.bottom-history a:hover     {   text-decoration: underline !important;}

@media (max-width:1124px){
.bottom-history-wrap { display:block;}
 .bottom-history {  display:block;float:none !important; width:100% !important; max-width:none !important;}
}

}


/* Social Icons */
.social { }
.social ul { margin: 0; padding: 0; }
.social li { display: inline-block; margin: 0; padding: 0; margin-right: 7px; }
.social li:last-child { margin-right: 0; }
.social li a { display: inline-block; width: 40px; height: 40px; opacity: 1; background: rgba(255,255,255,0.05); margin:0px 0px 4px 0px;
-webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; box-sizing:border-box; -moz-box-sizing:border-box; -webkit-box-sizing:border-box; /*border: 1px solid rgba(255,255,255,0.15);*/ padding: 0; }
.social li a:hover { border: 0; }
.social .s_icon { float: left; font-size: 20px; color: #bbb; color: rgba(255,255,255,0.65); text-align: center; width: 40px; line-height:40px; }
.social li a:hover .s_icon,
.sidebar_widget.social li a:hover .s_icon { color: #fff; }
.social ul li a.so_facebook:hover,
.sidebar_widget.social ul li a.so_facebook:hover { background: #4672b3; }
.social ul li a.so_twitter:hover,
.sidebar_widget.social ul li a.so_twitter:hover  { background: #099bcc; }
.social ul li a.so_gplus:hover,
.sidebar_widget.social ul li a.so_gplus:hover { background: #da4a38; }

.sidebar_widget .social li a { background: #eee; }
.sidebar_widget .social .s_icon { color: #555; }