/************************************************

	Template: Expanding Portfolio
	Author:   Luka Cvrk (www.solucija.com)

*************************************************/

/* GENERAL DEFINITIONS */
*{ margin: 0; padding: 0; outline: 0; }
body { font: .9em Arial, Sans-Serif; background-color:#4868a8; color: #777; text-align: center; }
a { color: #006FFF; text-decoration: none; }
a:hover {color: #ffbb04; text-decoration: none; }
p { line-height: 1.5em; margin: 0 0 10px;}
img { border: 0; }
.x { clear: both; }

/* LOGO */
h1 { float: left; margin: 40px 0 64px; font-size: 1.4em; letter-spacing: 6px; }
h1 a { color: #999; text-transform: uppercase; padding: 0 0 0px; }
h1 span { color: #B5DFD7; padding: 0 0 0px; }
h1 a:hover{ border-bottom: 1px dotted #444; }
	
h2 { font-size: 1.15em; color: #222; margin: 0 0 15px; line-height: 1.15em; }
h2 a { color: #222; }

h3 { font-size:1em; color: #006FFF; margin:0 0 15px; line-height: em; }
h3 a { color: #222; }

hr { color: #666666; width: 60%;}

#sb-body {
	position: relative;
	margin: 0px auto;
	padding: 0;
	overflow: hidden;
	border-radius: 2%;
}

#sb-nav a {
	display: block;
	float: right;
	height: 16px;
	width: 16px;
	margin-left: 3px;
	cursor: pointer;
	position: fixed;
	top: 28px;
	right: 20%;
	
}

#sb-body-inner {
	position: relative;
	margin: 0px auto;
	width: 60%;
	padding: 0;
	overflow: hidden;
	border: 1px solid #303030;
	border-radius: 2%;
}

/*HEADER LOGO*/
#headerlogo { position:absolute;top:0;left:0;height:231px;width:950px;}

/* CONTENT WRAPPER */
#content { clear: both; width: 950px; height:1350px; margin: 0 auto; text-align: left; background-image:url('images/enlargerbg.jpg');background-repeat:no-repeat; }

/* MENU */
#menu { float: right; margin: 38px 10px 0 0; text-transform: uppercase; }
#menu li { display: inline; list-style: none; }
#menu li a { float: left; color: #777; padding: 5px; margin: 0 0 0 20px; font-weight: bold; }
#menu li a:hover { color: #fff; }
#menu li a.current { color: #B5DFD7; }

/*NAVIGATION*/
#navigationdiv {float: right; position: relative; background-color:#9fbcf7; height:250px; width:180px; top:250px; padding-right:20px;}

ul.cssmenuside {
    border: 0 none;
    list-style: none outside none;
    padding: 0;
}
.displace {
    left: -5000px;
    position: absolute;
}
ul.cssmenuside li {
    float: left;
}
ul.cssmenuside li a {
    background: url('images/navigationbar.jpg') repeat scroll 0 0 transparent;
    display: block;
    height:50px;
    width:180px;
}
ul.cssmenuside li.Reviewers a {
    background-position: -10px -0px;
}
ul.cssmenuside li.Testimonials a {
    background-position: -10px -50px;
}
ul.cssmenuside li.Email a {
    background-position: -10px -100px;
}
ul.cssmenuside li.Register a {
    background-position: -10px -150px;
}
ul.cssmenuside li.Guidelines a {
    background-position: -10px -200px;
}

ul.cssmenuside li.Reviewers a:hover {
    background-position: -10px -249px;
}
ul.cssmenuside li.Testimonials a:hover {
    background-position: -10px -299px;
}
ul.cssmenuside li.Email a:hover {
    background-position: -10px -349px;
}
ul.cssmenuside li.Register a:hover {
    background-position: -10px -399px;
}
ul.cssmenuside li.Guidelines a:hover {
    background-position: -10px -449px;
}
 
/*SOCIAL MEDIA NAV*/
#socmednav {float: right; position: relative; background-color:#9fbcf7; height:60px; width:180px; top:0px; padding-right:20px;}
	
ul.socmedcssmenuside {
    border: 0 none;
    list-style: none outside none;
    padding: 0;
}
.displace {
    left: -5000px;
    position: absolute;
}
ul.socmedcssmenuside li {
    float: left;
}
ul.socmedcssmenuside li a {
    background: url('images/socnavmedbg.jpg') no-repeat scroll 0 0 transparent;
    display: block;
    height:50px;
    width:180px;
}
ul.socmedcssmenuside li.Facebook a {
    background-position: -10px -0px;
}
ul.socmedcssmenuside li.Twitter a {
    background-position: -10px -50px;
}

ul.socmedcssmenuside li.Facebook a:hover {
    background-position: -10px -250px;
}
ul.socmedcssmenuside li.Twitter a:hover {
    background-position: -10px -300px;
}

/*  COLUMNS (1/3) */
.col { float: left; width: 270px; background: #FFFFFF; padding: 15px !important; padding: 15px 15px 2px; margin: 250px 10px 35px 20px; text-align: left; border-top: 1px dotted #ddd; }
.col.last { float: right; margin-right: 20px; margin-top:300px; }
.col p { margin: 0 0 15px; }
.col.reviewers p{ font-size:0.9em; line-height:1.4em; width:500px;}
.more { float: left; position: relative; margin: 0 0 0 -21px; background: url(../images/more.gif) no-repeat; padding: 11px 21px 6px; color: #fff; font-size: .9em; font-weight: bold; }

.line { clear: both; margin: 0 0 10px; border-bottom: 1px dotted #ccc; }

/* LISTS */
#lists { float: left; width: 630px; margin: 0 0 22px; padding: 18px 0 0 10px; }
#lists ul { float: left; margin: 0 50px 0 0; }
#lists ul.last { margin: 0; }
#lists li { background: url(../images/bullet.gif) no-repeat 0 10px; list-style: none; padding: 5px 0 0 12px; color: #555; }
#lists li.title { color: #222; font-size: 1.2em; font-weight: bold; font-weight: bold; padding-bottom: 9px; text-transform: uppercase; } 
	
/* QUOTE */
#quote { float: center; width: 910px; padding: 0px; background:none; height: 130px; margin-bottom:30px; margin-left:18px;}
#author { font-weight: bold; padding: 10px 0 0;  }
	
/* FOOTER */
#footer { clear: both; color: #FFF; font-size: .94em; position:absolute; top:1200px; margin-left:20px; }
#flinks { float: right; }