*{
	box-sizing: border-box;
}

/* CSS Document */
@font-face {
	font-family: 'AkbarPlain';
	src: url('akbar-webfont.eot');
	src: url('../fonts/akbar-webfont.woff') format('woff'), url('../fonts/akbar-webfont.ttf') format('truetype'), url('../fonts/akbar-webfont.svg#webfontYUsBAP9y') format('svg');
	font-weight: normal;
	font-style: normal;
}
body {
	display:flex;
	width: 100%;
	height: 100%;
	justify-content: center;
	align-items: center;
	padding: 0;
	margin: 0;
	background: url(../images/berattorbg.jpg);
	background-attachment: fixed;
	background-size: cover;
	background-position: top;
	background-repeat: repeat;
	font-family:Segoe UI,Arial,Verdana,Helvetica,sans-serif;	
	
}
img {
	border:none;
}
#mainID{
	position:relative;
	display:flex;
	flex-direction: column;
	width:942px;
	height:auto;
	padding-bottom:5px;
	margin-top:5%;
	background:url(../images/berattor-mainbg.png);
}
#topID{
	position:relative;
	height:100px;
	background-repeat:no-repeat;
}
#logoID{
	position:absolute;
	top:30px;
	left:28px;
}
#topnavID{
	position:absolute;
	list-style-type: none;
	top: 2px;
	right: 23px;
	width: 166px;
	text-align:right;
}
#topnavID li{
	padding-left: 0.2em;
	margin-right:3px;
	display: inline;
	font-weight: normal;
	font-style: normal;
	line-height:normal;
	font-family: 'AkbarPlain', sans-serif;
	font-size:24px;
	color:#2a76d4;
}
#menuID{
	list-style-type: none;
	padding:0;
	margin-left: 1em;
	position:absolute;
	top: 35px;
	right: 26px;
	width: 536px;
	text-align:right;
}
#menuID li{
	background-repeat:no-repeat;
	background-position: 0.3em;
	padding-left: 0.7em;
	margin-right:3px;
	display: inline;
	font-weight: normal;
	font-style: normal;
	line-height:normal;
	font-family: 'AkbarPlain', sans-serif;
	font-size:24px;
	color:#2a76d4;
}
#menuID a:link{color:#2a76d4;	font-family: 'AkbarPlain', sans-serif;	font-size:24px; text-decoration:none;	font-weight: normal;font-style: normal;}
#menuID	a:visited{color:#2a76d4;font-family: 'AkbarPlain', sans-serif;	font-size:24px;	text-decoration:none;font-weight: normal;font-style: normal;}
#menuID a:hover{	color:#e80083;	font-family: 'AkbarPlain', sans-serif;	font-size:24px;	text-decoration:none;font-weight: normal;font-style: normal;}
#menuID a:active{	color:#2a76d4;	font-family: 'AkbarPlain', sans-serif;	font-size:24px;		text-decoration:none;font-weight: normal;font-style: normal;}


#middleID{
	position:relative;
	min-height:346px;
	height:100%;
}
#welcomeLayer{
	position:absolute;
	padding:0px;
	margin:0px;
	margin-top:10px;
	left:33px;
	width:418px;
	height:141px;
}
.layerTitle{
	position:absolute;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	font-size:24px;
	font-weight:normal;
	line-height:24px;
	color:#FFF;
	left:2px;
	width: 211px;
}
.layerText{
	position:relative;
	top:40px;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#FFF;
	line-height:24px;
	text-align:justify;
	font-weight:lighter;
	padding-left:3px;
}
#postLayer{
	position:absolute;
	padding:0px;
	margin:0px;
	margin-top:10px;
	right:33px;
	width:418px;
	height:141px;
}
#postTitle{
	color:#e80083;
}
#photoLayer{
	position:absolute;
	padding:0px;
	margin:0px;
	margin-top:10px;
	left:33px;
	width:418px;
	top:208px;
}
#tweetLayer{
	position:absolute;
	padding:0px;
	margin:0px;
	margin-top:10px;
	right:33px;
	width:418px;
	height:141px;
	top:208px;
}
#tweetTitle{
	color:#2a76d4;
}
#photoTitle{
	color:#666;
}
#bottomID{
	position:relative;
	height:105px;
}
#bottomBar{
	position:absolute;
	width:100%;
	height:67px;
	background-image:url(../images/bottom-middle-bg.png);
	background-repeat:repeat-x;
	bottom: 10px;
}
#copyrightID{
	position:absolute;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	font-size:12px;
	color:#FFF;
	top: 26px;
	left: 33px;
}
#socials{
	position:absolute;
	right: 24px;
	top:2px;
}
#socials li{
	padding-left: 0.2em;
	margin-right:3px;
	display: inline;
	font-weight: normal;
	font-style: normal;
	line-height:normal;
}
#aboutID{
	position:relative;
	margin-left:33px;
	margin-right:33px;
	margin-top:0px;
	width:540px;
	
}
.pageTitle{
	font-weight: normal;
	font-style: normal;
	line-height:normal;
	font-family: 'AkbarPlain', sans-serif;
	font-size:30px;
	color:#666666;
}
.contentP{
	position:relative;
	color:#FFFFFF;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	font-size:15px;
	margin-top:-25px;
	line-height:23px;
	font-weight:lighter;	
}
.content{
	position:relative;
	color:#FFFFFF;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	font-size:15px;
	line-height:23px;
	font-weight:lighter;
}
#berattor{
	float:right;
	margin-right:32px;
	margin-top:20px;
}
#berattor-portfolio{
	position:absolute;
	right:20px;
	top:140px;
	margin-right:32px;
	margin-top:20px;
}
#berattor-members{
	position:absolute;
	right:0px;
	top:0px;
	margin-right:32px;
	margin-top:20px;
}
#berattor-contact{
	position:absolute;
	left:52px;
	top:140px;
	margin-top:20px;
}
.edit{
	width:340px;
	height:30px;
	padding-left:5px;
	padding-top:0px;
	margin-bottom:10px;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	border:solid 1px #2a76d4;
	background-color:transparent;
	color:#FFFFFF;
	background:#333333;	
	font-size:15px;	
}
.text{
	width:340px;
	height:100px;
	padding-left:5px;
	padding-top:0px;
	margin-bottom:10px;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	border:solid 1px #2a76d4;
	background-color:transparent;
	background:#333333;	
	color:#FFFFFF;
	font-size:15px;
}
.select{
	width:347px;
	height:35px;
	padding-left:5px;
	padding-top:0px;
	margin-bottom:10px;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	font-size:15px;
	border:solid 1px #2a76d4;
	background-color:transparent;
	background:#333333;
	color:#FFFFFF;
}
#loginForm{
	position:relative;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	color:#2a76d4;
	list-style:none;
	margin-left:-40px;
	margin-top:-10px;
}

#portfolioForm{
	position:relative;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	color:#2a76d4;
	list-style:none;
	margin-left:-40px;
	margin-top:-10px;
}
#contactForm{
	width:360px;
	position:relative;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	color:#2a76d4;
	list-style:none;
	margin-left:-40px;
	margin-top:-10px;
}
.warning-img{
	position:absolute;
	margin-top:4px;
	display:none;
}
#blogID{
 position:relative;
 float:left;
 height:400px;
 width:680px;
 margin-left:32px;
 margin-top:10px;
}
#blogCats{
	float:right;
	width:200px;
	height:100%;
	margin-top:25px;
}
.blogTitle{
	position:relative;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	color:#2a76d4;
	margin:0px;
	font-size:19px;
	font-weight:lighter;
}
.blogInfo{
	position:relative;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	color:#696969;
	margin:0px;
	font-size:12px;
	font-weight:lighter;
	font-style:italic;
}
.blogContent{
	position:relative;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	color:#FFFFFF;
	font-size:15px;
	font-weight:lighter;
	margin-top:10px;
}
#blogArchieve{
	list-style:none;
	font-size:15px;
	font-family:Segoe UI,Arial, Helvetica, sans-serif;
	color:#e80083;
	margin:0px;
	margin-top:-15px;
	margin-left:-15px;
}
#blogArchieve li{
	margin:0px;
}
#blogID a:link{color:#e80083;	font-family:Segoe UI,Arial, Helvetica, sans-serif;	font-size:15px; text-decoration:none;	font-weight: normal;font-style: normal;}
#blogID	a:visited{color:#e80083;font-family:Segoe UI,Arial, Helvetica, sans-serif;	font-size:15px;	text-decoration:none;font-weight: normal;font-style: normal;}
#blogID a:hover{	color:#2a76d4;	font-family:Segoe UI,Arial, Helvetica, sans-serif;	font-size:15px;	text-decoration:none;font-weight: normal;font-style: normal;}
#blogID a:active{	color:#e80083;	font-family:Segoe UI,Arial, Helvetica, sans-serif;	font-size:15px;		text-decoration:none;font-weight: normal;font-style: normal;}
#berat{
	position:relative;
	height:750px;
}
.tweetContent{
	font-family:Segoe UI,Arial, Helvetica, sans-serif;	
	font-size:13px;
	font-weight:lighter;
	font-style:normal;
	line-height:13px;
}
.tweetTime{
	font-family:Segoe UI,Arial, Helvetica, sans-serif;	
	font-size:13px;
	font-weight:lighter;
	font-style:italic;
	color:#2a76d4;
}
#ulPhoto{
	position:relative;
	list-style:none;
	margin-left:-37px;
	margin-top:63px;
}
#ulPhoto li{
	position:relative;
	display:inline;
}
#ulPhoto li img{
	width:78px;
	height:82px;
	border:none;
}
#warningLayer{
	position:fixed;
	width:100%;
	bottom:0px;
	height:92px;
	background:url(../images/warning-bg.png);
}
#warningInfo{
	position:relative;
	height:92px;
	width:700px;
	margin-right:auto;
	margin-left:auto;
}
#warningImg{
	float:left;
	position:relative;
	top:12px;
	margin-right:20px;
	
}
#closeImg{
	position:absolute;
	top:10px;
	right:10px;
}
#warningText{
	position:relative;
	float:left;
	padding-top:30px;
	font-size:24px;
	color:#FFFFFF;

}