﻿body { background-color: #ffffff; margin: 0 0; padding: 0 0;  color: #666666; font-family: Calibri, Verdana, Arial; width: 100%;}
html {  width: 100%; }

h1, h2, h3, h4, h5, h6, p, a { color: #666666; font-family: Calibri, Verdana, Arial;}
input, textarea {color: #666666; font-family: Calibri, Verdana, Arial ;}
h1 { font-size: 30pt; }
h2 { font-size: 18pt; }
h3 { font-size: 11pt;  }
a { color: #666666; text-decoration: none;}
a:hover {text-decoration: underline; }
 
.cytraHilight { color:#8765a9 !important;}
.centeredImage { text-align: center; }

img {z-index: 10; }

#coreContent {  width: 100%; position: relative; display: block;float: left; margin-bottom: 10px; z-index: 10; min-width: 1050px; }
#coreContentInner { width: 1000px; margin:  0 auto; position: relative; top: 0; left: 0; background-color: #ffffff;}


/* ############### Header bar styles   ########################################## */
#topBar { width: 100%; display: block; float: left; min-width: 1050px;}
#topBarInner { width: 1000px; height: 180px; margin: 0 auto; position: relative; top: 0; left: 0; background-color: #ffffff; border-bottom: 2px solid #666666; margin-bottom: 10px;z-index: 100;}
#mainlogo { position: absolute; top: 0px; left: 20px;  background-image: url(../imgs/cytra-ltd-logo-2021.jpg); background-position: top right; background-repeat: no-repeat; width: 311px; height: 128px; overflow: hidden; float: left;}
#mainlogo h1 { text-indent: -9999px; }
#cytraBreadCrumb { width: 980px; height: 30px; font-size: 12px; padding-left: 20px; margin-top: 5px; }

#strapLine {width: 540px; height: 60px; position: absolute; top: 20px; left: 440px; }
#strapLine h2 {width: 540px; height: 60px; margin-top: 0; margin-bottom: 0; text-align: right; font-size: 22pt}    
#phoneNos {   position: absolute; top: 45px; right: 20px; }
#phoneNos h3 { text-align: right; font-weight: 800;margin: 20px 0 0 0; padding: 0 0 0 0;text-align: right; font-size: 60px; background-image: url(../imgs/phone-No-BG.gif); padding-left: 80px; background-repeat: no-repeat; background-position: left center ;}


#mainNav { width: 900px; height: 25px; position: absolute; top: 155px; left: 0px; z-index: 200; overflow: visible;}
#mainNav ul { padding-left: 10px; height: 25px; margin-left: 0; margin-top: 0px !important; margin-bottom: 0px !important; padding-bottom: 0px;}
#mainNav ul li { font-size: 12pt; font-weight: 600; color: #666666; list-style: none; float: left; position: relative; height: 25px;}
#mainNav ul li a {display: block; color: #666666; text-decoration: none; padding-left: 12px; padding-right: 12px; padding-top: 0px; padding-bottom: 0px; height: 25px;}
#mainNav ul li a:visited { color: #666666; text-decoration: none;}
#mainNav ul li a:hover { color: #666666; text-decoration: underline; background-color: #f0f0f0;}
.subNavPane { overflow: hidden; z-index: 300; position: absolute;  margin-top:0px; z-index: 900; height: 0;}
.subNavPaneOuter { padding-top: 7px; border-top: 2px solid #666666;}
.subNavPaneInner { background-color: #f0f0f0 !important; border-left: 2px solid #666666; padding-top: 0px; border-bottom: 2px solid #666666; border-right: 2px solid #666666; overflow: hidden;  padding-bottom: 2px; padding-top: 5px !important; display: block;}
.subNavPaneInner ul { padding: 0 0 !important; margin: 0 0 !important;}
.subNavPaneInner ul li { float: left; padding-top: 2px ! important; padding-bottom: 2px ! important;}
.subNavPaneInner ul li a:hover {background-color: #e0e0e0 !important;}
.linkBorderLeft { padding-left: 12px; padding-right: 12px; height: 25px; display: block;}

#contactUs { width: 120px;  position: absolute; top: 155px; left: 870px; z-index: 200; overflow: hidden;}
#contactUs a { height: 25px; font-size: 12pt; font-weight: 600; display: block; color: #666666; text-decoration: none; padding-left: 12px; padding-right: 12px;padding-top: 0px; padding-bottom: 0px;}
#contactUs  a:visited { color: #666666; text-decoration: none;}
#contactUs  a:hover { color: #666666; text-decoration: underline; background-color: #f0f0f0;}

/* ############## General Body Styles     ########################################## */
#heroHolder {position: relative; top: 0; left: 0px; width: 1000px;  border-bottom: solid 2px #666666; padding-bottom: 10px; }
#heroArea {position: relative; top: 0; left: 0px; width: 1000px;  height: 300px; background-repeat: no-repeat;}
#heroArea img { border: none 0px #ffffff;  margin-bottom: 10px;}

/* ############## Footer Styles     ########################################## */

#footerBar { display: block; background-color: #ffffff; color: #666666;  width: 100%; float: left;  min-width: 1050px;}
#footerBarInner { width: 1000px; margin: 0 auto;  background-color: #ffffff;}
#footerBar a { color: #333333; }
#footerBar p { color: #333333; }
#footerStrapline { float: left; }
#footerTop { border-bottom: 2px solid #666666; width: 1000px; float: left;}
#footerStrapline h4 { width: 500px; padding-left: 20px; padding-bottom: 5px;  margin-top: 0; margin-bottom: 0;  font-size: 14pt; float: left; }
#rightFooterNav { width: 460px; float: left; text-align: right; }
#rightFooterNav h4 { color: #666666; font-size: 10px;padding-top: 10px; margin-top: 0; margin-bottom: 5px;}  
#rightFooterNav h4 a { color: #666666; font-size: 10px;}  
#legalFooter { width: 1000px; margin-left: auto; margin-right: auto; position: relative; margin-top: 5px; margin-bottom: 10px; padding-left: 20px;  float: left;}
#legalText { width: 580px; float: left}
#legalText p { font-size: 8pt; margin-top: 3px; margin-bottom: 3px; margin-left: 0px; width: 580px; float: left;  color: #999999; }

#niceic { float: left; width: 400px; text-align: right; }
#websiteBy { width: 980px; text-align: right; float: left; }
#websiteBy p { font-size: 8pt;  color: #999999;  }
#websiteBy p a { text-decoration: none ; color: #999999; }
#websiteBy p a:hover { text-decoration: underline; }

/* ############### General Content styles   ########################################## */

#leftColumn { margin-left: 20px; overflow: hidden; float: left; margin-bottom: 40px;}
#leftColumn p { font-size: 11pt; }
#leftColumn h1, leftColumn h2 { font-size: 14pt; }
#leftColumn ul li{ font-size: 11pt;  color: #333333; font-family: Calibri, Verdana, Arial;}
#leftColumn h3 { font-size: 16pt; color:#8765a9 !important;}
#leftColumn p { font-size: 11pt; }

.normalWidth { width: 637px; }
.fullWidth { width: 1000px; }

.corePageContent h3 { font-size: 24pt; color:#8765a9 !important;}
.corePageContent p { font-size: 11pt; }
.corePageContent div { float: left; display: block; }
.corePageContent p img { margin: 10px 10px; border: 2px solid #dddddd; }
.corePageContent p a { background-color: #f2f2f2; float: none !important; padding: 0 0 !important; display: inline !important; font-size: 11pt !important;}
.corePageContent p a:hover { background-color: #f2f2f2 !important; text-decoration: underline !important; }
.corePageContent ul li { font-size: 14pt; }

#pageBody { padding-left: 20px; padding-right: 20px; width: 960px; }
#pageBody h3 { font-size: 24pt; color:#666666 !important; margin-top: 0px;}
#pageBody p { font-size: 12pt; }
#pageBody div { float: left; display: block; }
#pageBody p img { margin: 10px 10px; border: 2px solid #dddddd; }
#pageBody p a {  float: none !important; padding: 0 0 !important; display: inline !important; }
#pageBody p a:hover { text-decoration: underline !important; }
#pageBody ul li { font-size: 12pt;  padding-left: 20px;}
.noBullets { list-style-type: none; padding-left: 40px;}

/*  #####   Cookie Control    #####  */
#cookieBar {width: 100%; background-color: #aaaaaa; height: 0; overflow: hidden;  float: left; border-bottom: 1px solid #666666;  min-width: 1050px;}
#cookieBarInner { width: 1000px; margin:  0 auto; height: 120px; }
#cookieLeft { width: 800px; margin-left: 20px; float: left;}
#cookieLeft p.header { color: #666666; font-size: 18px; font-weight: 700; margin-bottom: 0px; background-color: #aaaaaa;}
#cookieLeft p { color: #666666; font-size: 12px; margin-right: 25px;  background-color: #aaaaaa;}
#cookieRight { background-color: #aaaaaa; float: left; width: 180px; text-align: center; padding-top: 20px; }
.cookieButton { display: block; width: 150px; height: 25px; vertical-align: middle; padding-top: 5px; background-color: #aaaaaa; background-image: url(../imgs/ButtonBG.gif); text-decoration: none; color: #666666;}
.cookieButton:hover { text-decoration: none; background-position: left bottom; background-color: #aaaaaa; }
.cookiePolicy { display: block; width: 150px; height: 25px; vertical-align: middle; padding-top: 5px; background-color: #aaaaaa; background-image: url(../imgs/ButtonBG.gif); text-decoration: none; color: #666666;}
.cookiePolicy:hover { text-decoration: none; background-position: left bottom ;}

/*   #####  Cookie Page Styles   #####  */

.cookieTable tbody tr th {font-size: 8pt !important;}
.cookieTable tbody tr td {font-size: 8pt !important; vertical-align: top;}
.cookieTable tbody tr td p {font-size: 8pt !important;}
.cookieTable tbody tr td p a {font-size: 8pt !important;}


/*   #####  Form Styles    #####  */
#QuotationForm { width: 600px; }
.formLabel { font-size: 12pt;width: 200px; padding-right: 20px; text-align: right; display: block; float: left; }
.quotationForm input { width: 350px; float: left; padding-left: 2px;font-size: 11pt; border-width: 1px; border-style: solid; border-color: #666666;}
.quotationFormselect { width: 255px; float: left; font-size: 11pt;}
.quotationForm textarea { width: 350px; float: left; font-size: 11pt; border-color: #666666;}
.formCheckError { border-color: #ff0000 !important; color: #ff0000;font-size: 11pt; }
.formCentered  { width: 200px;margin-left: 250px; margin-top: 30px; margin-bottom: 20px;} 
.formCentered a { padding-top: 4px;text-align: center; vertical-align:middle; display: block; width: 150px; height: 26px; background-image: url(../imgs/ButtonNoBG.gif) ; background-position: top left; }
.formCentered a:hover { background-position: bottom left; text-decoration: none; }
                  
/*  ##### Contact Us       #####   */
.contactForm { margin-top: 40px; float: left;}
/*.contactFormRow { width: 620px; float: left;}
.contactFormRow label { width: 150px; padding-right: 20px; text-align: right; display: block; float: left; }
.contactFormRow input { width: 350px; float: left; }
.contactFormRow select { width: 355px; float: left; }
.contactFormRow textarea { width: 350px; float: left; }
.inputcheckbox { width: 20px !important; float: left !important; margin-left: 100px !important;}
.checkboxLabel { text-align: left !important; width: 400px !important;} */

.contactSubmit { margin-top: 30px; float: left; text-align: center; margin-left: 220px; display: block; width: 150px; height: 26px; background-position: top left; background-image: url('../imgs/FormButtonBG.gif') ; padding-top: 4px; color: #333333; text-decoration: none;}
.contactSubmit:hover { background-position: bottom left; text-decoration: none;}
.locationMap { border: 2px solid #cccccc; margin-right: 20px !important; }

#ContactUsForm {width: 500px; border: 1px solid #666666; margin-top: 25px;}
#ContactUsFormSuccess {width: 500px; height: 300px; border: 1px solid #666666; margin-top: 25px;}
#ContactUsFormSuccess p, #ContactUsFormSuccess h4 { margin-left: 25px; }

#ContactUsForm h4 { margin-left: 25px; }
#ContactForm input { width: 250px; float: left; padding-left: 2px;font-size: 11pt; border-width: 1px; border-style: solid; border-color: #666666;}
#ContactForm select { width: 255px; float: left; font-size: 11pt;}
#ContactForm textarea { width: 250px; float: left; font-size: 11pt; border-color: #666666; }

.formCheckError { border-color: #ff0000 !important; color: #ff0000;font-size: 11pt; }
.formCentered  { width: 200px;margin-left: 250px; margin-top: 30px; margin-bottom: 20px;} 
.formCentered a { padding-top: 4px;text-align: center; vertical-align:middle; display: block; width: 150px; height: 26px; background-image: url(../imgs/ButtonNoBG.gif) ; background-position: top left; }
.formCentered a:hover { background-position: bottom left; text-decoration: none; }

.EditTitle { width: 1000px !important; color: #ff0000 !important; font-weight: 700 !important;}

#OurAddress {width: 350px; margin-top: 25px; margin-bottom: 35px;margin-left: 25px; padding-left: 25px; margin-right: 25px; border: 1px solid #666666; background-color: #eeeeee;}
#OurAddress p { margin-left: 25px; }


#formFailure { margin-left: 120px; margin-top: 20px; text-align: center;}
#formSentMessage { margin-left: 150px; margin-top: 20px; text-align: center;}



