/*
Software/Script: Coppermine Photo Gallery v1.4.25
Theme Name: Swiphone - Screen Stylesheet
Theme URL: http://www.swiphone.net
Description: CSS Main Page Layout
Version: 1.0.0
Author: Tommy Pettersson, Success Webmasters Pte. Ltd.
Author URL: http://www.successwebmasters.com

        This theme was designed and built by Tommy Pettersson,
        whose blog you will find at http://www.TommyPettersson.com

        The CSS, XHTML and design is copyright Success Webmasters Pte. Ltd.
*/


 /************************************************************************************/
 /* ------------------ THIS CODE IS THE GLOBAL BROWSER RESET ----------------------- */
 /************************************************************************************/
body,
div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td {
                    margin: 0;
                    padding: 0;
}

table {
                    border-collapse: collapse;
                    border-spacing: 0;
}

fieldset,img {
                    border:0;
}

address,caption,cite,code,dfn,em,strong,th,var {
                    font-style: normal;
                    font-weight: normal;
}

ol,ul {
                    list-style: none;
}

caption,th {
                    text-align: left;
}

q:before,q:after {
                    content:'';
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ------------- THIS CODE IS THE MAIN CODE THAT CONTROLS THE BODY ---------------- */
 /************************************************************************************/
html {
                    height: 100%!important;
                    height: auto;
                    margin-bottom: 1px;
                    /*
                    This is a hack to force scrollbars on at all times so that the page
                    does not jump when going from short to long pages.
                    */
}

body {
                    text-align: center; /*center hack*/
                    margin: 0;
                    padding-bottom: 0;
}

body#page {
                    margin-top: 0;
                    padding-bottom: 10px;
}

#top-bg {
                    position: absolute;
                    top: 0;
                    left: 0;
                    width: 100%;
                    height: 190px;
                    margin: 0;
                    padding: 0;
}

#container {
                    position: absolute;
                    top: 190px;
                    left: 0;
                    width: 100%;
                    height: 710px;
                    margin: 0;
                    z-index: 1;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ------------- THIS CODE IS FOR THE DIFFERENT WRAPPERS ON THE PAGE -------------- */
 /************************************************************************************/
div#template {
                    margin-top: 0;
                    margin-bottom: 0;
}

.page-wrapper {
                    position: relative;
                    width: 968px;  /* set width in pixels here */
                    height: auto;
                    text-align: left; /*center hack*/
                    margin: 0 auto; /*center hack*/
                    padding: 0;
                    z-index: 2;
}

                    /* WRAPPER for liquid design. Default is 90 percent. */
.fluid-wrapper {
                    position: relative;
                    width: 90%; /* set width in percent here */
                    width: auto !important; /*IE6 hack*/
                    width:960px; /*IE6 hack*/
                    min-width: 740px;
                    max-width: 970px;
                    height: auto;
                    text-align: left; /*center hack*/
                    margin: 0 auto; /*center hack*/
                    padding: 0;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ----- THIS PART IS GENERIC SAP CLASSES TO GIVE THE COLUMNS THE SAME HEIGHT ----- */
 /************************************************************************************/
.horiz-menu-line {
                    float: left;
                    width: 100%;
                    display: block;
                    position: relative; /*prevents shifting when changing viewport in IE;thanks to Alan Gresley*/
                    background-color: transparent;
}

.sapline {
                    float: left;
                    width: 100%;
                    display: block;
                    position: relative; /*prevents shifting when changing viewport in IE;thanks to Alan Gresley*/
                    overflow: hidden; /*only needed for equal height columns*/
                    background-color: transparent;
}

.sapitem {
                    position: relative;
                    float: left;
                    overflow: hidden;
                    left: 100%;
}

.column { /* all columns have continous background color */
                    margin-bottom: -6000px;
                    padding-bottom: 6000px;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* --------------- THIS CODE IS COMMON STYLES THAT IS USED ALL OVER --------------- */
 /************************************************************************************/
.clear {
                    clear: both;
}

.clickable_option {
                    cursor: default;
}

.doNotDisplay {
                    display: none !important;
}

.down_movie {
                    margin-top: 4px;
}

h1 {
                    margin: 2px;
}

h2 {
                    margin: 0px;
}

h3 {
                    margin: 0;
}

.hide {
                    display: none !important;
}

.noclear {
                    clear: none !important;
}

p {
                    margin: 2px 0px;
}

.spacer{
                    height: 20px;
}

strong {
                    font-weight: bold;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* --------------- THIS PART CONTROLS PICTURES AND ADVERTISEMENTS ----------------- */
 /************************************************************************************/

.footer-adspace {
                    height: 90px;
                    display: block;
                    margin-top: 4px;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ------------------ THIS PART CONTROLS THE FORM ELEMENTS ------------------------ */
 /************************************************************************************/
.textinput {
                    padding-right: 3px;
                    padding-left: 3px;
}

.comment_button {
                    padding-right: 3px;
                    padding-left: 3px;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ------------ THIS PART IS WHERE THE CODE FOR THE HEADER IS CREATED ------------- */
 /************************************************************************************/
#header {
                    position: relative;
                    width: 100%;
                    height: auto;
                    margin: 0;
                    padding: 0;
                    overflow: hidden;
}

#header .inside {
                    padding-top: 0;
                    padding-right: 0;
                    padding-bottom: 0;
                    padding-left: 0;
}

#header .left-box {
                    float: left;
                    width: 430px;
                    height: 190px;
                    display: block;
                    margin: 0;
                    padding: 0;
                    z-index: 10;
}

img#logo {
                    float: left;
                    width: 430px;
                    height: 190px;
                    display: block;
                    margin: 0;
                    z-index: 20;
}

#header .language-box {
                    float: right;
                    width: 510px;
                    height: 80px;
                    display: block;
                    margin-top: 10px;
                    margin-right: 0;
                    margin-bottom: 0;
                    margin-left: 0;
}

#header .right-box {
                    float: right;
                    width: 470px;
                    height: 60px;
                    display: block;
                    margin-top: 5px;
                    margin-right: 0;
                    margin-bottom: 0;
                    margin-left: 0;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ---------- HERE IS THE CODE FOR THE HORIZONTAL MENU BAR ON THE PAGES ----------- */
 /************************************************************************************/
#horiz-menu2 {
                    height: 150px;
                    display: block;
                    margin-top: 2px;
                    padding: 0;
}
#horiz-menu {
                    display: none !important;
}

 /* ----- END ----- */
#verticaltextmenu,
ul.bsm{
        margin: 0px auto;
        border:1px solid #B0B0B0;
        list-style-type: none;
}

ul.bsm li{
        border-left:2px solid #FFFFFF;
}
ul.bsm li.first,
#verticaltextmenu div.first{
        border-style: none;
}
ul.vertical li,
div.vertical div{
        border-top: 2px solid #ffffff;
        border-left-style: none;
}

#textmenu,
#fullwidthmenu{
        font-size:14pt;
        font-weight:bold;
}
#textmenu li,
#fullwidthmenu li{
        background-image:url(../images/header/byslidemenu.png);
        background-repeat:no-repeat;
        padding:4px 0 0 40px;
}
#textmenu li.icon1, #fullwidthmenu li.icon1{ background-position: 9px 4px; }
#textmenu li.icon2, #fullwidthmenu li.icon2{ background-position: 9px -22px; }
#textmenu li.icon3, #fullwidthmenu li.icon3{ background-position: 9px -48px; }
#textmenu li.icon4, #fullwidthmenu li.icon4{ background-position: 9px -74px; }
#textmenu li.icon5, #fullwidthmenu li.icon5{ background-position: 9px -100px; }
#textmenu li.icon6, #fullwidthmenu li.icon6{ background-position: 9px -126px; }
#textmenu li.icon7, #fullwidthmenu li.icon7{ background-position: 9px -152px; }
#textmenu li.icon8, #fullwidthmenu li.icon8{ background-position: 9px -178px; }
#textmenu li.icon9, #fullwidthmenu li.icon9{ background-position: 9px -204px; }

.bg1{ background-color: #F3F3F3; }
.bg2{ background-color: #E5E5E5; }

#verticaltextmenu h5{
        font-size:16pt;
        margin:2px 0 0;
        text-align:center;
}
#verticaltextmenu p{
        font-size:14pt;
        margin:0px;
        padding:5px;
        text-align:justify;
}

 /************************************************************************************/
 /* ----------- HERE IS THE CODE FOR THE ADVERTISING BOXES ON THE PAGES ------------ */
 /************************************************************************************/
#advertising_boxes_top1,
#advertising_boxes_album_list,
#advertising_boxes_thumb_view {
                    margin-top: 10px;
                    margin-right: 1px;
                    margin-bottom: 20px;
                    padding: 10px;
}

#advertising_boxes_top1 .block,
#advertising_boxes_album_list .block,
#advertising_boxes_thumb_view .block {
                    float: left;
                    padding: 0px;
                    overflow: hidden;
}

#advertising_boxes_top1 div.addivider,
#advertising_boxes_album_list div.addivider,
#advertising_boxes_thumb_view div.addivider {
                    width: 2px;
                    height: 125px;
                    margin-top: 10px;
                    margin-right: 11px;
                    margin-bottom: 10px;
                    margin-left: 11px;
}

#advertising_boxes_top1 div.advbox,
#advertising_boxes_album_list div.advbox,
#advertising_boxes_thumb_view div.advbox {
                    margin: 10px;
}

#advertising_boxes_top1 div.advbox div div div,
#advertising_boxes_album_list div.advbox div div div,
#advertising_boxes_thumb_view div.advbox div div div {
                    padding-top: 12px;
                    padding-right: 12px;
                    padding-bottom: 8px;
                    padding-left: 12px;
}

#advertising_banner_image {
                    margin-top: 0px;
                    margin-right: -1px;
                    margin-bottom: -1px;
                    padding: 10px;
}

 /* ----- END ----- */


  /************************************************************************************/
 /* ----------------- THIS IS THE STYLE FOR DIFFERENT MENUS IN USE ------------------ */
 /************************************************************************************/
 /* ----------------- THIS IS THE STYLE FOR THE ADMIN MENU ------------------ */
.admin-menu {
                    position: relative;
                    width: 100%;
                    height: 25px;
                    margin-top: 2px;
                    margin-bottom: 2px;
                    padding-top: 4px;
                    padding-right: 2px;
                    padding-bottom: 4px;
                    padding-left: 2px;
                    overflow: hidden;
}

.admin_menu a {
                    position: relative;
                    display: block;
                    padding-top: 1px;
                    padding-right: 2px;
                    padding-bottom: 1px;
                    padding-left: 2px;
}

.admin_menu_thumb {
                    width: 85px;
                    margin-top: 0px;
                    margin-bottom: 0px;
}

.admin_menu_thumb a {
                    position: relative;
                    display: block;
                    padding-top: 1px;
                    padding-right: 10px;
                    padding-bottom: 1px;
                    padding-left: 10px;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ------------ THIS IS THE WRAPPER THAT WRAPS ALL THE BODY FUNCTIONS ------------- */
 /************************************************************************************/
#contentwrap {
                    position: relative;
                    width: 100%;
                    height: auto;
                    padding: 0;
                    overflow: hidden;
border: 0px solid #00ff00;
}

#main-body {
                    position: relative;
                    width: 100%;
                    height: auto;
                    margin: 0;
                    padding: 0;
                    overflow: hidden;
border: 0px solid #ff0000;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* -------------- THIS IS THE CODE THAT CONTROLS THE LEFT SIDE -------------------- */
 /************************************************************************************/
#left-side {
                    margin-left: -100%;
                    width: 170px;
                    z-index: 100; /*prevent main content from obscuring sidebars */
border: 0px solid #ff0000;
}

div#left-side div.inside {
                    padding-top: 4px;
                    padding-right: 0;
                    padding-bottom: 0;
                    padding-left: 0;
}

#left-side h3 {
                    margin-top: 15px;
                    margin-right: 0;
                    margin-bottom: 5px;
                    margin-left: 10px;
}

#left-side ul {
                    list-style: none;
                    margin-top: 0;
                    margin-right: 10px;
                    margin-bottom: 10px;
                    margin-left: 0;
                    padding: 0;
}

#left-side li {
                    display: block;
                    margin: 1px 0;
                    padding: 4px 10px;
}

div.intro {
                    width: 146px;
                    margin-top: 0;
                    margin-right: 0;
                    margin-bottom: 10px;
                    margin-left: 0;
                    padding-top: 4px;
                    padding-right: 5px;
                    padding-bottom: 10px;
                    padding-left: 5px;
                    overflow: hidden;
}

div.intro h4 {
                    margin: 0;
                    padding: 0;
}

div.intro p {
                    margin: 3px 0 0 0;
                    padding: 0;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ---------------- THIS IS THE CODE FOR THE MAIN (MIDDLE) COLUMN ----------------- */
 /************************************************************************************/
#middle-column {
                    margin-left: -100%;
                    width: 100%;
}

#middle-column .inside {
                    padding-top: 0;
                    padding-right: 0px;
                    padding-bottom: 5px;
                    padding-left: 170px;
}

#main-body {
}

#main-body .linkunit22 {
                    position: relative;
                    height: 15px;
                    display: block;
}

#main-body .link-unit-top {
                    height: 15px;
                    margin-top: 4px;
                    margin-right: 1px;
                    margin-bottom: 10px;
                    margin-left: 0;
                    padding-top: 10px;
                    padding-right: 20px;
                    padding-bottom: 10px;
                    padding-left: 20px;
}

#messagebox {
                    display: none !important;
}

#messagebox2 {
                    height: 190px;
                    margin-top: 20px;
                    margin-right: 1px;
                    margin-bottom: 20px;
                    margin-left: 0;
                    padding-top: 20px;
                    padding-right: 20px;
                    padding-bottom: 20px;
                    padding-left: 20px;
}

#messagebox p {
                    padding-left: 180px;
}

 /* ----------------- THIS CODE CONTROLS THE BREADCRUMBS ------------------ */
#breadbox {
                    margin-top: 10px;
                    margin-right: 1px;
                    margin-bottom: 2px;
                    margin-left: 1px;
}

#breadbox .breadbox {
                    padding-top: 5px;
                    padding-right: 5px;
                    padding-bottom: 5px;
                    padding-left: 5px;
}

 /* ----------------- TABLE FOR OUTPUT FROM THE GALLERY ------------------ */
.maintable {
        margin-top: 1px;
        margin-bottom: 1px;
}

.tableh1 {
                    padding: 10px 8px;
}

.tableh1b {
                    padding: 10px 0px;
}

.tableh1_compact {
                    padding-top: 2px;
                    padding-right: 5px;
                    padding-bottom: 2px;
                    padding-left: 5px;
}

.tableh2 {
                    padding-top: 3px;
                    padding-right: 10px;
                    padding-bottom: 3px;
                    padding-left: 10px;
}

.tableh2_compact {
                    padding-top: 2px;
                    padding-right: 5px;
                    padding-bottom: 2px;
                    padding-left: 5px;
}

.tableb {
                    padding-top: 3px;
                    padding-right: 20px;
                    padding-bottom: 3px;
                    padding-left: 10px;
}

.tableb_compact {
                    padding-top: 4px;
                    padding-right: 5px;
                    padding-bottom: 4px;
                    padding-left: 5px;
}

.tablef {
                    padding-top: 10px;
                    padding-right: 10px;
                    padding-bottom: 10px;
                    padding-left: 10px;
}

.thumbnails {
                    padding: 10px 0px;
}

.thumb_title {
                    display : block;
                    padding: 2px;

}

.thumb_sub_title {
                    display : block;
                    padding: 2px;

}

.thumb_caption {
                    padding: 1px;
}

 /* ----------------- CATEGORIES OUTPUT FROM THE GALLERY ------------------ */
.catrow {
                    padding-top: 3px;
                    padding-right: 10px;
                    padding-bottom: 3px;
                    padding-left: 10px;
}

.catrow_noalb {
                    padding-top: 3px;
                    padding-right: 10px;
                    padding-bottom: 3px;
                    padding-left: 10px;
}

.catlink {
                    display: block;
                    margin-bottom: 2px;
}

 /* ----------------- ALBUM OUTPUT FROM THE GALLERY ------------------ */
.album_stat {
                    width: 120px;
                    margin: 5px auto;
}

 /* ----------------- THUMBNAIL OUTPUT FROM THE GALLERY ------------------ */
#thumbview {
                    margin-top: 0px;
                    margin-right: 1px;
                    margin-bottom: 0px;
                    margin-left: 1px;
}

#thumbview .tableh1 {
                    padding: 10px 8px;
}

.sortorder_cell {
                    margin: 0;
                    padding: 0;
}

.sortorder_options {
                    margin: 0;
                    padding: 0;
}

.statistics {
                    padding-top: 4px;
                    padding-right: 5px;
                    padding-bottom: 4px;
                    padding-left: 5px;
}

 /* ----------------- IMAGE VIEW OUTPUT FROM THE GALLERY ------------------ */
.navmenu a {
                    position: relative;
                    display: block;
                    padding-top: 2px;
                    padding-right: 5px;
                    padding-bottom: 2px;
                    padding-left: 5px;
}

.navmenu img {
                    margin-top: 1px;
                    margin-right: 5px;
                    margin-bottom: 1px;
                    margin-left: 5px;
}

.navmenu_pic {
                    /* SAKNAS I DENNA CSS */
}

#picinfo {
                    margin-top: 10px;                      /* SAKNAS I SAMPLE CSS */
                    margin-bottom: 10px;
}

.display_media {
                    padding-top: 3px;
                    padding-right: 10px;
                    padding-bottom: 3px;
                    padding-left: 10px;
}

.imageborder {
                    margin-top: 10px;
                    margin-right: 2px;
                    margin-bottom: 20px;
                    margin-left: 2px;
}

.image {
                    margin: 2px;
}

.image_caption {
                    padding-top: 3px;
                    padding-right: 20px;
                    padding-bottom: 20px;
                    padding-left: 10px;
}

p.image_caption {
                    padding-top: 3px;
                    padding-right: 0;
                    padding-bottom: 0;
                    padding-left: 0;
}

#filmstrip,
#rating,
#picinfo,
#comments,
#comments .comreg,
#add-comment {
                    margin-top: 10px;
                    margin-right: 1px;
                    margin-bottom: 20px;
                    margin-left: 1px;
}

#filmstrip .thumbs {
                    padding: 10px 0px;
}

#rating .rating_title,
#comments .comment_title,
#add-comment .comment_title,
#rating .rating_table,
#comments .comreg,
#comments .comment_author,
#comments .comment_comment,
#add-comment .comment_add,
#add-comment .comment_smilies {
                    padding-top: 5px;
                    padding-right: 5px;
                    padding-bottom: 5px;
                    padding-left: 5px;
}

.img_caption_table {
                    width: 100%;
                    margin: 0;
}

.img_caption_table th {
                    padding-top: 4px;
                    padding-right: 10px;
                    padding-bottom: 4px;
                    padding-left: 10px;
}

.img_caption_table td {
                    padding-top: 6px;
                    padding-right: 10px;
                    padding-bottom: 6px;
                    padding-left: 10px;
}

 /* ----------------- COMMENTS OUTPUT FROM THE GALLERY ------------------ */
.thumb_num_comments {
                    display: block;
                    padding: 2px;
}

 /* ----------------- LANGUAGE BOX OUTPUT FROM THE GALLERY ------------------ */

 /* ----------------- USER MANAGEMENT OUTPUT FROM THE GALLERY ------------------ */
.user_thumb_infobox {
                    margin-top: 1px;
                    margin-bottom: 1px;
}

.user_thumb_infobox th {
                    margin-top: 1px;
                    margin-bottom: 1px;
}

.user_thumb_infobox td {
                    margin-top: 1px;
                    margin-bottom: 1px;
}

 /* ----------------- ECARD OUTPUT FROM THE GALLERY ------------------ */
#ecard {
                    padding: 4px;
}

#ecard h2 {
                    margin-top: 10px;
                    margin-right: 0;
                    margin-bottom: 10px;
                    margin-left: 0;
}

#ecard h3 {
                    margin-top: 0;
                    margin-right: 0;
                    margin-bottom: 10px;
                    margin-left: 0;
}

 /* ----------------- MISC OUTPUT FROM THE GALLERY ------------------ */
.debug_text {
                    width: 100%;
                    margin: 0;
}

.thumb_filename {
                    display: block;
}

 /* ----------------- THE GALLERY POWERED BY FOOTER ------------------ */
.footer {
                    margin-top: 4px;
                    margin-bottom: 4px;
}

 /* ----- END ----- */


 /************************************************************************************/
 /* ---------------- THIS IS THE CODE THAT CONTROLS THE BOTTOM --------------------- */
 /************************************************************************************/
#bottomline {
                    border-bottom: none;
}

#bottomwrap {
                    margin: 0;
                    margin-left: -100%;
                    width: 100%;
                    height: auto;
}

#foot-menu {
                    padding-top: 15px;
                    padding-right: 10px;
                    padding-bottom: 15px;
                    padding-left: 10px;
                    overflow: hidden;
}

#foot-menu ul.menu_footmenu {
                    list-style: none;
                    margin: 0;
                    padding: 0;
}

#foot-menu ul.menu_footmenu li {
                    display: inline;
}

#foot-menu ul.menu_footmenu li a {
                    padding: 2px;
}

#foot-menu ul.menu_footmenu li .separator {
                    margin-top: 0;
                    margin-right: 2px;
                    margin-bottom: 0;
                    margin-left: 2px;
}

#footbar {
                    height: 55px;
                    margin-top: 3px;
                    margin-bottom: 5px;
                    padding-bottom: 8px;
}

#copyright {
                    float: left;
                    width: 46%;
                    height: 15px;
                    display: block;
                    padding: 10px;
}

#creator {
                    float: right;
                    width: 45%;
                    height: auto;
                    display: block;
                    margin-right: 10px;
                    padding: 10px;
}

#custom_footer {
                    padding: 0;
}

#vanity-wrap {
                    position: relative;
                    display: block;
                    width: 100%;
                    height: auto;
                    clear: both;
}

#vanity a {
                    display: block;
                    width: 57px;
                    height: 20px;
                    margin: 3px 20px;
}

#v_php {
                    float: left;
}

#v_mysql {
                    float: left;
}

#v_xhtml {
                    float: right;
}

#v_css {
                    float: right;
}

 /* ----- END ----- */