﻿#gallery
{
    margin-left: -50px; 
	clear: both;
}

#gallery_wrapper
{
    width: 700px;
    overflow: hidden;
    padding: 10px 0px 30px 0px;
    margin: auto;
}
#gallery_title_wrapper
{
    height: 29px;
    float: right;
    width: 970px;
}
#gallery_title_wrapper div.right
{
    width: 7px;
    height: 29px;
    background-image: url("../Content/Images/project_gallery_title_right.png");
    float: right;
}
#gallery_title_wrapper div.middle
{
    height: 29px;
    background-image: url("../Content/Images/project_gallery_title_middle.png");
    float: right;
    line-height: 29px;
    color: #da970e;
    font-size: 16px;
    text-align: center;
    font-weight: bold;
    padding: 0px 10px;
}
#gallery_title_wrapper div.left
{
    width: 14px;
    height: 29px;
    background-image: url("../Content/Images/project_gallery_title_left.png");
    float: right;
}

#gallery_content
{
    width: 680px;
    height: 148px; /*background-image: url("../Content/Images/project_gallery_bg.png");*/
    float: left;
    overflow: hidden;
    position: relative;
}
#gallery_images_wrapper
{
    width: 460px;
    height: 164px;
    margin: auto;
    position: relative;
    overflow: hidden;
}
#gallery_images_wrapper ul
{
    margin: 0px;
    padding: 0px;
    position: relative;
}
#gallery_images_wrapper li
{
    display: block;
    width: 144px;
    height: 164px;
    background-image: url("../Content/Images/gallery_img_bg.png");
    float: left;
    margin: 0px 4px;
    text-align: center;
}
#gallery_images_wrapper li a
{
    display: inline-block;
    width: 124px;
    height: 140px;
    margin-left: 0px;
    margin-top: 14px;
    text-decoration: none;
}

#gallery_images_wrapper li a img
{
    border: none;
    border-radius: 7px 7px 7px 7px;
}

#gallery_content a.right
{
    width: 58px;
    height: 52px;
    background-image: url("../Content/Images/project_gallery_right_arrow.png");
    background-position: left top;
    float: right;
    display: block;
    margin: 48px 44px 61px 2px;
    cursor: pointer;
}

#gallery_content a.right:hover, #gallery_content a.left:hover
{
    background-position: left bottom;
}

#gallery_content a.left
{
    width: 58px;
    height: 52px;
    background-image: url("../Content/Images/project_gallery_left_arrow.png");
    background-position: left top;
    float: left;
    display: block;
    margin: 48px 2px 61px 44px;
    cursor: pointer;
}

a.la_galerie
{
    float: right;
    font-size: 10px;
    color: #ff9800;
    display: block;
    height: 16px;
    text-align: right;
    width: 98px;
    background-image: url("../Content/Images/arrow_down_gallery.png");
    background-position: left center;
    background-repeat: no-repeat;
    font-weight: bold;
}
a.la_continut
{
    float: right;
    font-size: 10px;
    color: #ff9800;
    display: block;
    height: 16px;
    text-align: right;
    width: 103px;
    background-image: url("../Content/Images/arrow_up_gallery.png");
    background-position: left center;
    background-repeat: no-repeat;
    font-weight: bold;
}

.gallery_play_buttons
{
    width: 200px;
    height: 30px;
    float: left;
    padding-right: 0px;
    text-align: left;
}

.gallery_play_buttons a
{
    display: inline-block;
    width: 20px;
    height: 20px;
    cursor: pointer;
    float: left;
    margin-right: 5px;
    background-position: top;
}
.gallery_play_buttons a:hover, .gallery_play_buttons a.selected
{
    background-position: bottom;
}
.gallery_play_buttons a.play
{
    background-image: url("../Content/Images/play-icon.png");
}
.gallery_play_buttons a.stop
{
    background-image: url("../Content/Images/stop-icon.png");
}
.gallery_play_buttons a.pause
{
    background-image: url("../Content/Images/pause-icon.png");
}

#articol_wrapper
{
    padding: 0px 10px 15px 10px;
}
#articol_wrapper a
{
    color: #A2BC66;
    font-size: 13px;
    padding: 0px 10px 0px 10px;
    font-weight: bold;
    text-decoration: none;
}
#articol_wrapper a:hover, #articol_wrapper a.current
{
    text-decoration: underline;
}
div.titlu_articol
{
    padding: 10px;
    text-align: center;
    font-weight: bold;
    font-size: 20px;
    color: #DA970E;
}
div.descriere_articol
{
    padding: 10px;
}
div.descriere_articol table
{
    width: 100% !important;
    margin: 0px;
    padding: 0px;
}


/**********************/


/*
	root element for the scrollable.
	when scrolling occurs this element stays still.
*/
.scrollable
{
    /* required settings */
    position: relative;
    overflow: hidden;
    width: 848px;
    height: 164px; /* custom decorations */
    border: none;
}

/*
	root element for scrollable items. Must be absolutely positioned
	and it should have a extremely large width to accomodate scrollable items.
	it's enough that you set the width and height for the root element and
	not for this element.
*/
.scrollable .items
{
    /* this cannot be too large */
    width: 20000em;
    position: absolute;
    clear: both;
}

.items div
{
    float: left;
    width: 848px;
}

/* active item */
.scrollable .active
{
    border: 2px solid #000;
    position: relative;
    cursor: default;
}


