/**
 * textobox.com CSS stylesheet
 * author: Fabrice Bodmer (fabrice.bodmer@netoxygen.ch)
 * date:   january - may 2006
 * (c)2006 Net Oxygen Sàrl
 */

/*****************************************************************************/
/**** STRUCTURE **************************************************************/

body {
   font-family: Arial, Verdana, Arial, Helvetica, sans-serif;
   font-size: 12px; 
   text-align:justify;
   background-color: #eeeeee;
   background: url("images/page_bg.png");
   color: #333;
   text-align: center;
   margin: 0;
   margin-top: 15px;
   margin-bottom: 25px;
   padding: 0;
}

#main {
   background: url("images/content_bg.png");
   background-repeat: repeat-y;
   border: none;
   background-color: #ffffff;
   text-align: left;
   margin: auto;
   padding: 0;
   width: 746px;
}

#top {
   background: url("images/top.png")
   no-repeat bottom center;
   margin: 0 !important;
   margin: 0 0 0 1px;
   margin-bottom:0;
   padding: 0;
   height: 19px;
   width: 100%;
   background-color: #ffffff;
}

#logo-img {
   position: relative;
   left: 30px;
   border: 0px;
   bottom: 0px;
   margin: 0px;
   margin-bottom: 0px;
}

#my-textobox-com {
   position: relative;
   left: 485px;
   border: 0px;
   bottom: 0px;
   margin: 0px;
   margin-bottom: 9px;
}

#header-image {
   /*height: 233px;*/
   border: 0px;
   padding: 0px;
   padding-left: 3px;
   margin: 0px;
   margin-bottom: -5px; /* Necessary, because if height of div is not
                           specified, the rendered height of the div is 5px
                           more than the contained image's height. */
}
#header-image img {
   border: 0px;
   margin: 0px;
   padding: 0px;
}

div.content {
   /*margin-left: 4px;*/
   /*margin-right: 4px;*/
   margin-left: 30px;
   margin-right: 30px;
   margin-top: 30px;
   margin-bottom: 25px;
   /*width: 686px;*/
   /*width: 100%;*/
   position: relative;
   /*float: left;*/
   text-align: justify;
}

#mytextobox {
   text-align: right; margin: auto;
   position:absolute; padding: 0;
   width: 740px; padding-left: -375px;
   margin-top:-20px;}
#mytextobox a {color:gray;}

/*** MENU ********************************************************************/
#menu {
   /*height: 26px;*/
   margin-top: 5px;
   margin-left: 4px;
   margin-right: 4px;
   padding-left: 26px; /* 26=22+4 (4=li left-margin) */
   padding-right: 26px;
   padding-bottom: 1px;
   border-bottom: 1px dashed #bbbbbb;
   z-index: 501;
}

#menu ul {
   padding: 0px;
   margin-top: 0px;
   margin-bottom: 0px;
   border-top: 0px;
   border-bottom: 0px;
   margin-left: 0px;
   padding-left: 0px;
}

#menu ul li {
   list-style: none;
   display: inline;
}

#menu li:hover, .ieLIhover, #active-page {
   /*background-color: #535353;*/
   color: #000000;
   border-bottom: 3px solid #000000;
}

#menu li, .ieLI {
   font-family: Georgia, "Times New Roman", serif;
   font-size: 19px;
   font-style: italic;
   font-weight: normal;
   text-align: left;
   margin-top: 3px;
   margin-bottom: 0px;
   margin-left: 0px;
   margin-right: 20px;
   padding-left: 0px; /*4*/
   padding-right: 0px; /*4*/
}

#menu a {
   text-decoration: none;
   color: #000000;
}
#menu a:hover {
   color: #000000;
}



/*** SUBMENU *****************************************************************/
#submenu {
   margin-left: 4px;
   margin-right: 4px;
   padding-left: 26px;
   padding-right: 26px;
   border-bottom: 1px dashed #bbbbbb;
   margin-top: 0px;
   margin-bottom: 0px;
   font-family : Georgia, "Times New Roman", serif;
   font-size : 12px; 
   text-align:justify;
   color: #999999;
   background-color: #f8f7ef;
}

#submenu a {
   color: #999999;
   text-decoration: none;
}

#submenu a:hover {
   color: #000000;
}

#submenu ul {
   padding: 0px;
   margin: 0px;
   margin-left: 0px;
   padding-left: 0px;
}

#submenu ul li {
   list-style: none;
   display: inline;
}

#submenu li {
   padding-right: 10px;
   border-left: 1px dashed #bbbbbb;
   padding-left: 10px;
}

#submenu li:first-child {
   padding-right: 10px;
   border-left: 0px;
   padding-left: 0px;
}

/*** FOOTER ******************************************************************/
div.foot {
   background-color: #eee;
   padding: 0 0 0 0px;
   margin: 0 auto;
   width: 746px;
   height: 63px;
   clear: both;
   background: url("images/footer.png") no-repeat bottom;
   border: none;
}

div.foot p {
   padding-top: 20px;
   text-align: center;
   font-size: 9px;
   color: #535353;
}

div.foot a {
   text-decoration: none;
   color: #535353;
}

div.foot a:hover {
   text-decoration: underline;
}

/**** END OF STRUCTURE *******************************************************/
/*****************************************************************************/

/*****************************************************************************/
/**** CONTENT STYLES *********************************************************/

/**** ICON TEXT SECTION ******************************************************/
.icon-text-section {
   padding-left: 118px;
   margin-top: 30px;
   margin-bottom: 30px;
   vertical-align: top;
}

.icon-text {
   float: left;
   width: 150px;
   /*display: block;*/
   font-size: 12px;
   text-align: center;
   vertical-align: top;
}

.icon-text img {
   margin-bottom: 5px;
   border: 0px;
}

.icon-text a {
   text-decoration: none;
   color: red;
}

.icon-text a:hover {
   text-decoration: underline;
}

.icon-text p {
   margin-top: 5px;
   margin-left: 5px;
   margin-right: 5px;
   text-decoration: none;
}

/* arggggg! why is ie the dominant browser???
.icontext:first-child {
   border-left: 0px;
}
*/

.borders {
   border-left: solid 1px #e7e7e7;
   border-right: solid 1px #e7e7e7;
}

.noborders {
   border: 0px;
}

#soon {
   font-size: 25px;
   text-align: center;
   margin-top: 30px;
   margin-bottom: 30px;
}

#soon p {
   border: dashed 1px #bbbbbb;
}

/*** INLINE STYLES ***********************************************************/

#content p {

}

#content .center {
   text-align: center;
}

#content a {
   text-decoration: underline;
   color: #000000;
}

#content a:hover {
   
}

#content a[href ^="http://"],
#content a[href ^="https://"] {
   background: url(images/external.png) center right no-repeat;
   padding-right: 13px;
}

#content .image-right {
   float: right;
   margin-left: 20px;
   margin-right: 0px;
   margin-top: 10px;
   margin-bottom: 10px;
   border: 0px;
}

#content h1 {
   font-size: 18px;
   text-align: center;
   margin-bottom: 25px;
}

#content h2 {
   color: #000000;
   font-size: 15px;
   text-align: left;
   clear: right;
}

#content h3 {
   background: url("images/feature-entry-h2-decoration.png");
   background-repeat: no-repeat;
   background-position: top left;
   text-indent: 40px;
   margin-top: 30px;
   padding-top: 15px;
   padding-bottom: 12px;
   font-size: 15px;
   text-align: left;
   clear: right;
}

#content .no_image {
   background-image: none;
   text-indent: 0px;
   margin-top: 30px;
   padding-top: 15px;
   padding-bottom: 12px;
   font-size: 15px;
   text-align: left;
   clear: right;
}

/* title for code functions */
#content h4 {
   text-indent: 0px;
   margin-top: 20px;
   padding-top: 15px;
   padding-bottom: 0px;
   margin-bottom: 0px;
   font-size: 12px;
   font-style: italic;
   text-align: left;
   clear: right;
   line-height: 4px;
}

#content li {
   list-style-type: none;
   background: url("images/list-item-decoration.png");
   background-repeat: no-repeat;
   background-position: top left;
   padding-left: 20px;
   padding-bottom: 10px;
   /*list-style-image: url("images/list-item-decoration.png");*/
}

#content li>p {
   font-style: italic;
   padding-right: 40px;
}

#content .small {
   font-size: 9px;
   color: #535353;
}

#content .reg-form table {
   width: 500px;
   border-collapse: collapse;
   color: #000000;
   border: 0px solid black;
   margin-left: 100px;
}

#content .reg-form th {
   font-weight: normal;
   text-align: right;
   vertical-align: middle;
   padding-right: 5px;
   /*color: #535353;*/
}

#content .reg-form td {
   vertical-align: middle;
   /*border-bottom: 1px solid white;*/
   padding: 4px;
}

#content .reg-form input {
   border: 1px solid #535353;
   vertical-align: middle;
}

#content .reg-form .text-input {
   width: 80%;
   height: 20px;
}

#content .reg-form .text-area {
   width: 80%;
   /*height: 50px;*/
   border: 1px solid #535353;
}

#content .reg-form h2 {
   border-bottom: 1px solid #000000;
}

#content .reg-form .invalid-form-elt {
   border: 1px solid #ff7777;
   border-bottom: none;
   background: #ff7777;
}

#content .reg-form .invalid-form-elt-between {
   border-left: 1px solid #ff7777;
   border-right: 1px solid #ff7777;
}

#content .reg-form .invalid-form-elt-msg {
   border: 1px solid #ff7777;
   border-top: none;
   color: red;
   font-size: 10px;
}

#content .reg-form ul li {
   left: 0px;
   margin-left: 0px;
   padding-left: 0px;
   text-indent: 0px;
   background: none;
   background-image: none;
   list-style-type: disc;
   list-style-image: none;
}

/* div for code samples*/
.code {
    border: 1px dashed silver;
    background-color: #F1F4E6;
    padding: 4px;
    display: block;
    overflow: visible;
}

/*  Offre Noël*/
.noel_start {
    position: absolute;
    top: 50px;
    width: 200px;
    right: 10px;
    border: 1px dashed gray;
}
.noel_start .container {
    padding: 8px;
}
.noel_start h1 {
    margin: 0px;
    padding: 0px;
    line-height: 16px;
    color: gray;
}
.noel_box {
    width: 440px;
    background-image: url('images/snowflake.png');
    background-position: right top;
    background-repeat: no-repeat;
}
.noel_box h1 {
   
}
.noel_conditions {
    font-size: 9px;
    color: gray;
}

#noel_li li{
    background: none;
    list-style-image: none;
    list-style-type: disc;
    list-style-position: outside;
}
.noel_arrow {
   background: url("images/list-item-decoration.png");
   background-repeat: no-repeat;
   background-position: top left;
   padding-left: 20px;
   padding-bottom: 10px;
}


#news {
border: 1px solid #DDDDDD;background: #EEEEEE;
}
#news h2 {padding:4px;margin-top:4px;padding-top:0px;padding-bottom:0px;margin-bottom:2px;line-height:14px;}
#news p {padding:4px;}

/**** END CONTENT STYLES *****************************************************/
/*****************************************************************************/