@charset "utf-8";
/* CSS Document */
table, html, body { border-collapse: collapse; border-spacing: 0; padding: 0px; font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma; color: #DFDFDF; font-size: 11px;   }
th, td, tr { padding: 0px; spacing: 0px; }

html,body {
    height: 100%;
}

.loginregisterst{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 10px;
	text-transform: uppercase;
	line-height: normal;
	color: #FFFFFF;
	text-align: right;
	vertical-align: middle;
	height: 25px;
}
.menu:hover{
	cursor: pointer;

}
.menuLine{
	border-right: 1px solid #ada495;
	background-repeat: repeat;
	background-image: url(imgss/menuBack.png);
}
.logoST{
	font-family: "Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 16px;
	color: #929898;
	background-image: url(imgss/logo.png);
	background-repeat: no-repeat;
	padding-left: 17px;
	padding-top: 0px;
	height: 156px;
}
.logoST:hover{
	cursor: pointer;
	
}
.footer{
	padding-left: 10px;
	padding-right: 10px;
	height: 100px;
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
}
a.lnk{
	text-decoration: none;
	color: #797e81;
}
.text10ptwt{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	color: #bcc2c5;
	font-size: 10px;
}
.text10ptPinkUp{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 10px;
	text-transform: uppercase;
	color: #454a4d; 
}
.menuName{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 11px;
	text-transform: uppercase;
	color: #fefefe; 
	font-weight: bold;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 7px;
	padding-bottom: 7px;
	background-image: url("imgss/menuBottomLine.png");
	background-repeat: repeat-x;
	background-position: bottom;
}
.menuName:hover{
	cursor: pointer;
	animation-name: menublink;
    animation-duration: 0.3s;
    animation-fill-mode: both;
}
@keyframes menublink {
  0%   { background-color: #626264;  color: black; }
  100%  { background-color: #323232; color: white; }
}
.subMenuName{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 12px;
	color: #fefefe; 
	padding-left: 45px;
	padding-right: 10px;
	padding-top: 5px;
	padding-bottom: 5px;
}

.closeM{
	animation-name: closeAllMenu;
    animation-duration: 0.7s;
    animation-fill-mode: both;
}
@keyframes closeAllMenu {
  0%   { left: 0px; opacity: 1; }
  40%   { left: 0px; opacity: 0.5;  }
  100%  { left: -226px; opacity: 0.2;  }
}

.openM{
	animation-name: openAllMenu;
    animation-duration: 0.7s;
    animation-fill-mode: both;
}
@keyframes openAllMenu {
  0%   { left: -226px; opacity: 0.2; }
  40%   { left: -226px; opacity: 0.5; }
  100%  { left: 0px; opacity: 1; }
}


.closeAbout{
	animation-name: closeAllAbout;
    animation-duration: 0.7s;
    animation-fill-mode: both;
}
@keyframes closeAllAbout {
  0%   { right: 0px; opacity: 1; }
  40%   { right: 0px; opacity: 0.5;  }
  100%  { right: -400px; opacity: 0.2;  }
}

.openAbout{
	animation-name: openAllAbout;
    animation-duration: 0.7s;
    animation-fill-mode: both;
}
@keyframes openAllAbout {
  0%   { right: -400px; opacity: 0.2; }
  40%   { right: -400px; opacity: 0.5; }
  100%  { right: 0px; opacity: 1; }
}



.footerLine{
	background: url("imgss/footerLine.png");
	background-repeat: repeat-x;
	font-family: Arial, Tahoma;
	font-size: 10px;
	height: 34px;
	font-weight: bold;
	color: #bdc2c5;
	text-transform: uppercase;
	padding-left: 10px;
	padding-right: 10px;
	padding-top: 10px;	
}
.footerLogosBack{
	background: #293133;
	height: 100px;
}
.aboutBlock{
	background: url("imgss/aboutBack.png");
	background-repeat: repeat;
	font-family: "Arial Narrow", Arial, Tahoma;
	font-size: 12px;
	color: #3c3b3b; 
	position: absolute;
	width: 400px;
}
.topLinks{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 12px;
	color: #929898; 
	vertical-align: middle;
	text-decoration: none;
	font-weight: bold;
}
.aboutTitleBlock{
	padding-left: 15px;
	padding-right: 15px;
	background: url("imgss/aboutTitleBack.png");
	background-repeat: repeat;
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 22px;
	text-transform: uppercase;
	color: #6f7478;
	font-weight: normal;
}
.aboutSubheader{
	color: #91979C;
	font-size: 11px;
	font-weight: normal;
}
.aboutMenuLinks{
	padding-left: 15px;
	padding-right: 15px;
	background: #1e1e1e;
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 11px;
	text-transform: uppercase;
	color: #a7adad;
	font-weight:200;
}
.aboutMenuItem{
    font-family: "Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
    font-size: 11px;
    text-transform: uppercase;
    color: #a7adad;
    font-weight: 200;
    border-right: 1px solid #353434;
    border-left: 1px solid #353434;
	text-decoration: none;
	padding-left: 7px;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 7px;
	float: left;
}
.aboutMenuItem:hover{
	cursor: pointer;
	background: #000000;
	color: #FFFFFF;
}
.aboutNumber{
	font-family:"Felix Titling", "Franklin Gothic Medium Cond", "Arial Narrow", Arial;
	font-size: 48px;
	color: #b2acac;
	padding-left: 10px;
	padding-right: 10px;
	text-align: center;
}
.aboutClose{
	font-family: Arial, "Arial Narrow", Tahoma;
	font-weight: bold;
	font-size: 10px;
	color: #3a3a3a;
	position: absolute;
	top: 5px;
	right: 5px;
	width: 15px;
	height: 15px;
	text-align: right;
	cursor: pointer;
}
.aboutTextBlock{
	padding-left: 15px;
	padding-right: 15px;
	font-family: "Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 14px;
	color:#000000;
	text-align: justify;
}
.aboutPicture{
	float: left;
	width: 200px;
	height: 112px;
}
.aboutPicture:hover{
	cursor: pointer;
}
.aboutPictureHeader{
	height: 25px;
	width: 180px;
	position: absolute;
	font-family: "Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 10px;
	color:#9CA0A2;
	text-transform: uppercase;
	padding: 10px;
	vertical-align: middle;
	background: url("imgss/aboutPictureBack.png");
	background-repeat: repeat;
	bottom: 0px;
}
.aboutPictureHeader:hover{
	color: #FFFFFF;
}

.aboutAdPicture{
	float: left;
	width: 200px;
	height: 112px;
	padding: 17px;
}
.aboutAdPicture:hover{
	cursor: pointer;
}

.footerClient{
	width: 120px;
	height: 50px;
	border: 1px solid #4e4f4f;
	text-align: center;
	vertical-align: middle;
}
.footerClient:hover{
	cursor: pointer;
	opacity: 0.7;
}
.aboutAdTop{
	background: url("imgss/about-ad-top-back.png");
	background-repeat: repeat-x;
	height: 6px;
}
.aboutAdBottom{
	background: url("imgss/about-ad-bottom-back.png");
	background-repeat: repeat-x;
	height: 6px;
}
.aboutAdMid{
	background: url("imgss/about-ad-mid-back.png");
	background-repeat: repeat;
	height: 1%;
	padding: 20px;
}
.aboutAdH{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 24px;
	color: #FFFFFF;
	text-transform: uppercase;
}
.aboutAdAfterH{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 18px;
	color: #FFFFFF;
}
.aboutAdText{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 14px;
	color: #C1C1C1;
}
.moreArrow{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 10px;
	color: #797e81;
	text-transform: uppercase;
	text-decoration: none;
	vertical-align: middle;
}
.moreArrow:hover{
	cursor: pointer;
}
.pressF11{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 10px;
	color: #797e81;
	vertical-align: middle;
	text-align: center;
}
.aboutSubMenu{
	font-family: "Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 10px;
	color:#434445;
	text-transform: uppercase;
	padding: 10px;
	text-decoration: none;
}
.productsAdAfterH{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 18px;
	color: #FFFFFF;
	text-transform: uppercase;
}
.client{
	float: left;
	width: 140px;
	height: 90px;
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 10px;
	color: #797e81;
	background: #293133;
	border: 1px solid #4e4f4f;
	padding: 10px;
	margin: 5px;
	vertical-align: middle;
	text-align: center;
}
.clientsa:hover{
	cursor: pointer;
	color: #F7F7F7;
}
.clientsa{
	text-decoration: none;
	color: #797e81;
}
.porfH{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 12px;
	color: #929898;
	text-align: center;
	text-transform: uppercase;
	font-weight: bold;
	padding-bottom: 10px;
}
.porfDate{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 11px;
	color: #4f4f4b;
	text-align: center;
	padding-bottom: 15px;
}
.porfText{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 12px;
	color: #646768;
	text-align: center;
}

.disappearBack{
	animation-name: backgroundDisappear;
    animation-duration: 3s;
}
@keyframes backgroundDisappear {
  0%   { opacity: 1;   }
  100%  { opacity: 0; }
}

.appearBack{
	animation-name: backgroundAppear;
    animation-duration: 3s;
}
@keyframes backgroundAppear {
  0%   { opacity: 0;   }
  100%  { opacity: 1; }
}
.blankBack{
	color: #606060;
}
.news_ad{
	width: 95%;
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 12px;
	color: #96999a;
	background: #1f1f20;
	border: 1px solid #4e4f4f;
	margin: 15px;
}
.newsH{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	text-decoration: none;
	color: #FFFFFF;
	text-transform: uppercase;
	font-size: 13px;
	font-weight: bold;
}
.newsDate{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	color: #FFFFFF;
	font-size: 11px;
	padding-top: 3px;
}
.newsText{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	color: #96999a;
	font-size: 12px;
}
.F1seasons{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 10px;
	color: #b9b8b8;
	text-transform: uppercase;
	text-decoration: none;
	font-weight: bold;
}
.F1detailsOf{
    font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 12px;
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
	padding-top: 10px;
}
.detailImg{
	position: relative;
	text-decoration: none;
	color: #FFFFFF;
}
.detailImg:hover{
	opacity: 0.85;
}
.weCreated{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 10px;
	color: #ffffff;
	padding-top: 15px;
	padding-bottom: 10px;
}
.detailB{
	float: left;
	width: 201px;
	height: 130px;
	padding: 10px;
}
.detailH{
	font-family:"Arial Narrow", Arial, "Franklin Gothic Medium Cond", Tahoma;
	font-size: 10px;
	color: #ffffff;
	text-transform: uppercase;
	text-decoration: none;
	padding-top: 5px;
}
.OverBack{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 20px;
	color: #FFFFFF;
}
.moveOverBack{
	animation-name: moveOBback;
    animation-duration: 7s;
}
@keyframes moveOBback {
  0%   { opacity: 0; left: -100%;  }
  5%   { opacity: 1; left: 0px;  }
  20%   { opacity: 1; left: 0px;  }
  90%   { opacity: 1; left: 0px;  }
  100%  { opacity: 0; left: -100%; }
}
.textBlockBlink{
	animation-name: textBlockB;
    animation-duration: 0.2s;
}
@keyframes textBlockB {
  0%   { opacity: 1;   }
  100%  { opacity: 0;  }
}
@keyframes blink {
            0% { opacity: 1; }
            50% { opacity: 0.5; }
            100% { opacity: 1; }
        }

.blinking-text {
     animation: blink 0.05s infinite; /* Adjust the animation duration as needed */
    }
.inCreation{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 12px;
	color: #6b7171;
	font-weight: bold;
	vertical-align: middle;
	text-align: center;
}
.titleUAB{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 16px;
	color: #929898;
	font-weight: bold;
	vertical-align: middle;
	text-align: center;
}
.titleSub{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 12px;
	color: #929898;
	font-weight: bold;
	vertical-align: middle;
	text-align: center;
}
.sentence{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 14px;
	color: #e9f2ed;
	font-weight: bold;
	text-transform: uppercase;
}
.MR{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 9px;
	color: #5a6167;
	font-weight: bold;
	text-transform: uppercase;
}
.tF11{
	font-family:"Franklin Gothic Medium Cond", "Arial Narrow", Arial, Tahoma;
	font-size: 9px;
	color: #7A8084;
	text-transform: uppercase;
}
.enterButton{
	background: url('imgss/enterWebsite.png'); 
	background-repeat: no-repeat; 
	width: 133px; 
	height: 32px; 
	margin: 0 auto;  
	padding-top: 11px; 
	text-align: left; 
	vertical-align: middle; 
	color: #5a6167; 
	text-transform: uppercase;
}
.enterButton:hover{
	cursor: pointer;
	color: #101456;
}
.fade-inT {
      animation: fadeInT 2s ease-in-out forwards; /* Use the fadeIn animation for 2 seconds */
      opacity: 0; /* Set initial opacity to 0 */
    }

 @keyframes fadeInT {
      0% {
        opacity: 0;
      }
      100% {
        opacity: 1;
      }
    }
.fade-Out {
      animation: fadeOut 2s; /* Use the fadeIn animation for 2 seconds */
      opacity: 1; /* Set initial opacity to 0 */
    }

 @keyframes fadeOut {
      0% {
		left:0px;
        opacity: 1;
      }
      100% {
		left: -100%;
        opacity: 0;
      }
    }

.but{
	background: #2E2E2E;
	color: #FFFFFF;
	font-size: 11px;
	padding: 5px;
	text-align: center;
	width: 100px;
	border: 1px solid #636363; 
	border-radius: 10px;
	cursor: pointer;
}
.inp{
	font-size: 11px;
	padding: 5px;
	width: 200px;
	border: 1px solid #24A576;
	border-radius: 10px;
}