root {
    margin: 0 0;
    padding: 0 0;
}

html {
    margin: 0 0;
    padding: 0 0;
    width: 100%;
}

body {
    margin: 0 0;
    padding: 0 0;
    width: 100%;
    background-color: #FDD017;
    font-family: "Times New Roman", arial, serif ,georgia, Verdana, "Trebuchet MS", Helvetica;
}

/* DIVS */

#container {
    margin: 0 0;
    padding: 0 0;
    width: 100%;
    overflow: hidden;
    background-color: gray;
    position: relative;
}

#outerheader {
    width: 100%;
    height: 300px;
    background-color: black;
    background-image: url('images/header_gradient.jpg');
    background-repeat: repeat-x;
    float: left;
}

#outerheader_middle {
    width: 100%;
    height: 100px;
    background-color: #FDD017;
    background-image: url('images/outerheader_middle.jpg');
    background-repeat: repeat-x;
    float: left;
    margin-top: -20px;
}

#header_top {
    width: 1000px;
    height: 100px;
    margin: 0 auto;
}

#header_middle {
    width: 1000px;
    height: 100px;
    background-color: #FDD017;
    background-image: url('images/outerheader_middle.jpg');
    background-repeat: repeat-x;
    margin: 0 auto;
}

#header_bottom {
    width: 1000px;
    height: 100px;
    margin: 0 auto;
}

#logo {
    float: left;
    margin: 0px 0px;
    margin-top: 10px;
    margin-bottom: 20px;
}

#contact_top {
    margin: 0 0;
    padding: 5px 0;
    float: right;
    margin-right: 0px;
    width: 560px;
    height: 20px;
    background-image: url('images/contact.png');
}

#menu {
    float: right;
}

#slogan {
    width: 760px;
    height: 80px;
    float: left;
}

#callback {
    width: 220px;
    height: 90px;
    margin: 5px 0px;
    float: right;
}

#web {
    width: 280px;
    float: left;
    margin-top: 5px;
}

#graphics {
    width: 280px;
    float: left;
    margin-top: 5px;
    margin-left: 77px;
}

#twitter {
    width: 175px;
    float: right;
    margin-top: 30px;
    margin-right: 20px;
}
#twitter img { margin: 0; padding: 0; border: none;}

#topshadow {
    width: 100%;
    height: 10px;
    background-image: url('images/top_shadow.png');
    background-repeat: repeat-x;
    float: left;
}

#outercontent {
    width: 100%;
    background-color: #FFFFF0;
    float: left;
}

#jsError {
    width: 1000px;
    padding: 10px 0px;
    border: 1px solid #FDD017;
    background-color: #FFFFE0;
    margin-top: 10px;
}

#content {
    width: 1000px;
    background-color: #FFFFF0;
    margin: 0 auto;
}

#bottomshadow {
    width: 100%;
    height: 10px;
    background-image: url('images/bottom_shadow.png');
    background-repeat: repeat-x;
    float: left;
}

#outerfooter { 
    width: 100%;
    height: 260px;
    background-color: #FDD017;
    float: left;
    background-image: url('images/footer.jpg');
    background-repeat: repeat-x;
}

#footer {
    width: 1000px;
    height: 120px;
    background-color: #FDD017;
    margin: 0 auto;
    background-image: url('images/footer.jpg');
    background-repeat: repeat-x;
    padding-top: 12px;
}

#about {
    width: 280px;
    height: 200px;
    float: left;
}

#services {
    width: 280px;
    height: 200px;
    margin-left: 75px;
    float: left;
}

#validation {
    width: 280px;
    height: 200px;
    margin-left: 75px;
    float: left;
}

#symbols {
    width: 88px;
    height: 180px;
    float: right;
    margin: 0 0;
    padding: 0 0;
}

#copyright {
    float: left;
    margin: 10px auto;
    width: 1000px;
    text-align: center;
    font-style: italic;
    font-size: 14px;
}

#mainPageContent {
    float: left;
    width: 420px;
}

#mainPageLatestSites {
    width: 500px;
    float: right;;
    margin-bottom: 20px;
}
#mainPageLatestSites a { color: black; text-decoration: none;}
#mainPageLatestSites a:hover { color: #FDD017 ;}

#mainPageSitesWrap {
    width: 500px;
    margin-bottom: 20px;
}
#mainPageLatestSites h1 {
    text-align: center;
}
#mainPageLatest {
    width: 500px;
    float: left;
}
#mainPageNextSites {
    float: left;
    width: 500px;
    margin-top: 10px;
}

#servicesMain {
    width: 700px;
    float: left;
    margin-bottom: 20px;
}
#servicesOther {
    width: 260px;
    float: right;
    border: 1px solid #FDD017;
    background-color: #FFFFE0;
    padding: 0 10px;
    padding-bottom: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

#package {
    width: 960px;
    background-color: #FFFFE0;
    border: 1px solid #fdd017;
    padding: 10px 20px;
    float: left;
    margin-bottom: 20px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

#portfolio {
    width: 1000px;
    float: left;
}
#row1, #row2, #row3 {
    width: 1000px;
    float: left;
}
#site1,#site2,#site3 {
    width: 290px;
    float: left;
    border: 1px solid #FDD017;
    background-color: #FFFFE0;
    margin-right: 61px;
    margin-bottom: 20px;
    padding-bottom: 10px;
    cursor: pointer;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}
#site1 h2:hover,#site2 h2:hover,#site3 h2:hover {
    color: #FDD017;
}
#site3 { margin-right: 0px; }
#project {
    width: 1000px;
    border: 1px solid #FDD017;
    background-color: #FFFFE0;
    float: left;
    margin-bottom: 20px;
    padding-bottom: 10px;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

#contact {
    width: 450px;
    float: left;
}
#details {
    width: 450px;
    margin: 20px 0px;
}
#contactForm {
    width: 450px;
    float: left;
}

#map {
    width: 500px;
    float: right;
    margin: 20px 0px;
}
#map_canvas {
    width: 500px;
    height: 500px;
    margin: 20px 0px;
    border: 1px solid #fdd017;
}
#skype {
    width: 500px;
    float: right;
    border: 1px solid #FDD017;
    background-color: #FFFFE0;
    margin-bottom: 20px;
    padding: 10px 0;
    -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px;
}

#skype h2 { margin: 0 0; padding: 0 0; float: left; vertical-align: middle; }
/* END DIVS */

/* ALL HEADER RELATED STUFF */

img.blogLink { border: none; position:absolute; top: 0; left: 0; z-index: 100;}

ul.contact {
    display:inline;
    list-style:none;
}
ul.contact li { float: left; text-align: center; color: black;  }
ul.contact li img {  margin: 0 0; padding: 0 0; border: none; }
ul.contact li a { text-decoration: none; color: black;}
ul.contact li a:hover { color: #838383; }
li.tel { padding-left: 20px; margin-top: -3px; width: 150px; }
li.tel a { margin: 0 0; padding: 0 0; float: right; margin-left: -30px; margin-top: 0px; width: 120px;}
li.tel img { vertical-align: middle;}
li.email { padding-left: 10px; width: 190px; }
li.email a {  margin: 0 0; padding: 0 0; float: left;  margin-top: -2px; }
li.email img { vertical-align: middle;}
li.quote { padding-left: 10px; width: 140px; }
li.quote a { margin: 0 0; padding: 0 0; float: left;   margin-top: -2px; }
li.quote img {vertical-align: middle; }

ul.menu {
    display: inline;
    float: right;
    list-style: none;
    font-size: 30px;
    height: 50px;
    width: auto;
    margin: 0 0;
    padding: 0 0;
    margin-top: 20px;
}
ul.menu li { float: left; height: 50px; padding: 5px 0; margin: 0 0; }
ul.menu li a {  text-decoration: none; text-align: center; padding-top: 30px; padding: 0 20px; color: white;}
ul.menu li a:hover {  color: #FDD017;}
ul.menu li a.menu_home { width: 120px;}
ul.menu li a.menu_services { width: 120px;}
ul.menu li a.menu_portfolio { width: 120px;}
ul.menu li a.menu_contact { width: 120px; margin-right: -20px;}

p.slogan {
    width: 500px;
    margin: 0 0;
    padding: 0 0;
    margin-top: 15px;
    font-weight: bold;
    font-size: 30px;
    float: left;
}
p.caption {
    width: 500px;
    font-weight: normal;
    margin: 0 0;
    padding: 0 0;
    font-size: 30px;
    float: left;
}

#header_bottom p { font-size: 16px; }

h1.callback { font-size: 26px; margin: 0 0; padding: 0 0; padding-bottom: 5px;}

#web img, #graphics img, #apps img { border: none; float: left; padding-top: 15px; padding-bottom: 30px; padding-right: 5px;}
#web a, #graphics a, #apps a { color: #FDD017; text-decoration: none;}
#web a:hover, #graphics a:hover, #apps a:hover { color: white; }
#web p, #graphics p, #apps p { color: white; margin: 0 0; padding: 0 0; text-align: justify; }

/* END ALL HEADER RELATED STUFF!! */

/* ALL CONTENT STUFF */

#content h1 {
    font-weight: bold;
    font-size: 28px;
    font-style: italic;
}
#content p { font-size: 18px;}
ul.mainPageServices { margin-top: 20px;}
ul.mainPageServices li { list-style-image: url('images/tick.png'); margin-top: 10px; font-size: 18px; }

#servicesMain h2, #servicesOther h2 { font-style:italic; font-weight: bold; font-size: 22px;}
#servicesOther h3 {margin-top: 30px;}
#servicesMain p, #servicesOther p { margin-top: 15px;}
#servicesMain img { float: left; }

#site1 h2,#site2 h2,#site3 h2 { text-align: center; font-weight: bold; font-size: 22px; font-style:italic; margin: 0 0; padding: 0 0; margin-top: 10px; }
#site1 img ,#site2 img ,#site3 img { width: 270px; margin:10px 10px; border: none;}
#site1 p,#site2 p,#site3 p {width: 270px; margin: 0px 10px; margin-bottom: 10px; text-align: center;}
#site1 a.link,#site2 a.link,#site3 a.link { width: 270px; float: left; text-align: center; margin: 0px 10px; margin-bottom: 10px; text-decoration: none; color: #fdd017; }
#site1 a.link:hover,#site2 a.link:hover,#site3 a.link:hover { color: black; }
p.clickImage { font-style: italic; text-align: center; color: #FDD017; }

#project h2 { margin-left: 270px; margin-top: 5px;}
#project img { margin: 10px 10px; float: left; border: 1px solid #FFFFE0; }
#project img:hover { border: 1px solid #fdd017; }
#project a { color: black; text-decoration: none;}
#project a:hover { color: #FDD017; }

table.package { width: 960px; float: left; margin-bottom: 25px;  }
table.package th {  width: 210px; text-align: right; padding : 0 0; vertical-align: middle; padding-right: 50px; }
table.package td { width: 150px; text-align: center; vertical-align: middle; }
table.package td.deal { vertical-align: bottom; padding: 0; border: none; }
table.package td.getPackage { border: none; }

table.packageDesc { margin-bottom: 20px; }
table.packageDesc td {padding: 10px 0; vertical-align: top; }
table.packageDesc th { width: 240px; text-align: left; padding-right: 10px; padding-top: 10px; vertical-align: top;}

table.package input {
    margin-top: 10px;
    padding: 9px;
	outline: 0;
	font: normal 13px/100% Verdana, Tahoma, sans-serif;
	width: 200px;
    margin-bottom: 10px;
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
    cursor: pointer;
}

table.package input.bronzeSubmit {
    border: solid 1px #9C6963;
	background: #FFFFFF url('bg_form.png') left top repeat-x;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #9C6963), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #9C6963 1px, #FFFFFF 25px);
}

table.package input.silverSubmit {
    border: solid 1px #c9cfc9;
	background: #FFFFFF url('bg_form.png') left top repeat-x;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #C9CFC9), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #C9CFC9 1px, #FFFFFF 25px);
}

table.package input.goldSubmit {
    border: solid 1px #ffd017;
	background: #FFFFFF url('bg_form.png') left top repeat-x;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #ffd017), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #ffd017 1px, #FFFFFF 25px);
}

table.package input:hover {
    font-weight: bold;
    border: 1px solid black;
}

table.contact th { text-align: left; vertical-align: top; width: 150px; }
table.contact input { width: 250px; margin-bottom: 10px;}
table.contact textarea { width: 250px; height: 100px; }
p.contact { width: 450px; }

#contact h2 { font-style: italic; }
#map h2 { font-style: italic; }

 h2 { font-weight: bold; font-size: 22px; font-style:italic;  }
 h3 { font-style: italic; }

 a { color: #ffd017; text-decoration: none; }
 a:hover { color: black; }
 a:visited { color: #707070;}
 a:visited:hover { color: black; }
/* END OF ALL CONTENT STUFF */

/* ALL FOOTER RELATED STUFF */

h1.footer { padding: 0 0; margin: 0 0; font-weight: normal; font-size: 22px; color: black; margin-bottom: 8px; }
p.footer { padding: 0 0; margin: 0 0; font-size: 16px; color: black; text-align: justify}
p.footer a { text-decoration: none; color: black; }
p.footer a:hover { color: #838383;}
#validation p { float: left; text-align: justify; width: 180px;}
#symbols img, p, a { margin: 0 0; padding: 0 0;}

#copyright a { text-decoration: none; color: black; }
#copyright a:hover { color: white;}
/* END ALL FOOTER RELATED STUFF */

#holder_images { display: none; }
#carousel { margin-bottom: 50px;}
#carousel img { border: 2px solid #ddd; }
#carousel img.link:hover { border: 4px solid #0e0893; }

/* CONTACT FORM RELATED CSS */

#contactForm
{
    margin-top: 30px;
}
#contactForm input, textarea {
	padding: 9px;
	border: solid 1px #FDD017;
	outline: 0;
	font: normal 13px/100% Verdana, Tahoma, sans-serif;
	width: 200px;
    margin-bottom: 10px;
	background: #FFFFFF url('bg_form.png') left top repeat-x;
	background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #fff9d9), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #fff9d9 1px, #FFFFFF 25px);
	box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-moz-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	-webkit-box-shadow: rgba(0,0,0, 0.1) 0px 0px 8px;
	}

#contactForm textarea {
	width: 400px;
	max-width: 400px;
	height: 150px;
	line-height: 150%;
	}

#contactForm input:hover, textarea:hover,
input:focus, textarea:focus {
	border-color: #C9C9C9;
	-webkit-box-shadow: rgba(0, 0, 0, 0.15) 0px 0px 8px;
	}

#contactForm .form label {
	margin-left: 10px;
	color: #999999;
	}

#contactForm .submit input {
    background: -webkit-gradient(linear, left top, left 25, from(#FFFFFF), color-stop(4%, #fff9d9), to(#FFFFFF));
	background: -moz-linear-gradient(top, #FFFFFF, #fff9d9 1px, #FFFFFF 25px);
    width: 220px;
}

#contactForm .submit input:hover {
    font-weight: bold;
    border: 1px solid black;
}

#contactForm .radio {
    width: 10px;
    color: #999999;
}

#contactForm h2 { color: #999999; }

#feedback-content { width: 500px; float: left; }
#feedback-form { width: 500px; float: left; }
#feedback-right { width: 400px; float: right; border: 1px solid #FDD017; background-color: #FFFFE0; padding: 10px 20px;     -moz-border-radius: 20px;
    -webkit-border-radius: 20px;
    -khtml-border-radius: 20px;
    border-radius: 20px; }
#feedback-right li { margin: 5px 0; }

/* DOCK RELATED CSS */

.wrapper{
      font-family:Arial, Helvetica, sans-serif;
      margin-top:100px;
      margin-left:50px;
    }
    .wrapper h1{
      font-family:Arial, Helvetica, sans-serif;
      font-size:26px;
    }
    .evidence{
      color:gray;
      padding:10px;
      margin-right:5px;
      margin-top:5px;
      -moz-border-radius:10px;
      -webkit-border-radius:10px;
    }

    #actions button{
      padding:4px;
      display:inline-block;
      cursor:pointer;
      font:12px/14px Arial, Helvetica, sans-serif;
      color:#666;
      border:1px solid #999;
      background-color:#eee;
      -moz-border-radius:10px;
      -webkit-border-radius:10px;
      -moz-box-shadow:#999 2px 0px 3px;
      -webkit-box-shadow:#999 2px 0px 3px;
      margin-bottom:4px;
    }


    :focus {
      outline: 0;
    }

    #actions button:hover{
      color:#aaa;
      background-color:#000;
    }

    #dock{
      display:block;
      padding-top:10px;
      height:40px;
    }
    #dock img{
      padding-right:10px;
    }

    #desk{
      width:100%;
    }

    #desk td{
      padding:5px;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
    }
    #mb_console{
      padding:5px;
      background:gainsboro;
      -moz-border-radius:5px;
      -webkit-border-radius:5px;
      font-size:10px;
      height:400px;
      overflow:auto;
    }

p#iconPopup
{
    color: white;
    padding: 0;
    margin: 0;
    text-align: center;
}

/* BOX */

#box {
    background-color: white;
    border: 1px solid #FDD017;
    -moz-border-radius: 10px;
    -webkit-border-radius: 10px;
    -khtml-border-radius: 10px;
    border-radius: 10px;
    margin: 50px 0 10px 0;
}

#boxhead {
    -moz-border-radius-topright: 10px;
    -moz-border-radius-topleft: 10px;
    -webkit-border-top-right-radius: 10px;
    -webkit-border-top-left-radius: 10px;
    /*-khtml-border-radius: 10px;*/
    border-top-right-radius: 10px;
    border-top-left-radius: 10px;
}
#boxhead h2 {
    margin: 0; padding: 0;
    color: black;
    text-align: center;
    padding: 5px 0;
}
#boxcontents { width: 400px;  margin-left: 10px; margin-top: 10px;}

#adsense { width: 336px; height: 280px; margin-top: 20px; margin-left: 82px;}

.yellowbox {
    background: -webkit-gradient(linear, left top, left bottom, from(white), to(#efe08f)); /* for webkit browsers */
    background: -moz-linear-gradient(top, white, #efe08f ); /* for firefox 3.6+ */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=white, endColorstr=#efe08f);
    -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=white, endColorstr=#efe08f)";
} #box.yellowbox #boxhead { background-color: #f9d016;}

