html {	background: #ededed; }
body { font-family: 'Signika', Arial, sans-serif; font-weight: 300; color: #444;  }
a { color: #FF4000; }
a:hover { color: #FF4000; text-decoration: none; }


h1,h2 { font-weight: 700; }
h3,h4,h5 { font-weight: 600; }
strong { font-weight: 400; }

.clear { clear: both; }


#container { margin: auto; width: 800px; position: relative; padding-bottom: 50px; clear: both; float:none; overflow:auto; background-image: url(images/sites/capkandi/main_small.jpg); }
#container #mainHead { margin: auto; width: 760px; position: relative; clear: both; }
#container #mainHead span.email { position: absolute; top: 0px; right: 0; font-weight: 400; font-size: 1.1em; }
#container span.email a { 

	color: #069; text-decoration: none;

	display: block; float: left;	
	padding: 0.5em 1em;
	border-radius: 5px;
	
	background: rgb(247,247,247); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(247,247,247,1) 0%, rgba(243,243,243,1) 47%, rgba(240,240,240,1) 99%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(247,247,247,1)), color-stop(47%,rgba(243,243,243,1)), color-stop(99%,rgba(240,240,240,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(243,243,243,1) 47%,rgba(240,240,240,1) 99%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(243,243,243,1) 47%,rgba(240,240,240,1) 99%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(243,243,243,1) 47%,rgba(240,240,240,1) 99%); /* IE10+ */
	background: linear-gradient(top,  rgba(247,247,247,1) 0%,rgba(243,243,243,1) 47%,rgba(240,240,240,1) 99%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#f0f0f0',GradientType=0 ); /* IE6-9 */
	
	text-shadow: 0 1px 0 #EEE;
	color: #444;
	border: 1px solid #DDD;
	
	-webkit-transition: all 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
   -moz-transition: all 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
	-ms-transition: all 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
	 -o-transition: all 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
		transition: all 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); /* easeInOutCirc */
}
#container span.email a:hover { border-color: #BBB; box-shadow: 0 2px 2px #DDD; }

#container a.button { 
	display: block; float: left; 
	font-size: 1.3em; line-height: 2.5em; font-weight: 600; text-decoration: none; 
	padding: 0 2em; margin: 0 5px; 
	border-radius: 5px; 
	
	background: #efefef; /* Old browsers */
	background: -moz-linear-gradient(top,  #efefef 0%, #cecece 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#efefef), color-stop(100%,#cecece)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  #efefef 0%,#cecece 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  #efefef 0%,#cecece 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  #efefef 0%,#cecece 100%); /* IE10+ */
	background: linear-gradient(top,  #efefef 0%,#cecece 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#efefef', endColorstr='#cecece',GradientType=0 ); /* IE6-9 */
	
	box-shadow: 0 15px 19px -10px #333333, 0 1px 1px 0 #FFFFFF inset, 0 -1px 2px -1px #666 inset; 
	text-shadow: 0 1px 0 #FFF; color: #333; 
}
body #container a.button:hover {
	
	background: rgb(94,94,94); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(94,94,94,1) 1%, rgba(40,40,40,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(94,94,94,1)), color-stop(100%,rgba(40,40,40,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(94,94,94,1) 1%,rgba(40,40,40,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(94,94,94,1) 1%,rgba(40,40,40,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(94,94,94,1) 1%,rgba(40,40,40,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(94,94,94,1) 1%,rgba(40,40,40,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#5e5e5e', endColorstr='#282828',GradientType=0 ); /* IE6-9 */
	
	box-shadow: 0 15px 19px -10px #333, 0px 1px 1px 0px #CCC inset, 0 -1px 2px -1px #000 inset;
	border-color: #282828;
	color: #DDD;
	text-shadow: 0 -1px 0 #000;
	
}

#landing #container #mainHead h1 { background: url(../images/simey.png) no-repeat; height: 275px; margin-top: 30px; }
#landing #container #mainHead h1 a { display: block; height: 275px; text-indent: -999em; }
#landing #container #mainHead p { font-size: 2.5em; font-weight: 700; color: #333; position: absolute; left: 102px; top: 187px; }

#landing #container #main { clear: both; float: none; position: relative; top: -30px; }
#landing #container #main .buttons { margin: auto; padding: 10px; width: 735px; }
#landing #container #main a.button.portfolio { 	margin-left: 116px;  }

#landing #container footer { width: 610px; padding-right: 10px; padding-left: 10px;  clear: both; float: none; margin: 60px 0 50px;}
#landing #container footer p { text-align: center; padding: 0px; margin: 0px; }



#container a.button.portfolio { 
	
	background: rgb(209,249,7); /* Old browsers */ 
	background: -moz-linear-gradient(top,  rgba(209,249,7,1) 1%, rgba(129,198,1,1) 100%); /* FF3.6+ */ 
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(209,249,7,1)), color-stop(100%,rgba(129,198,1,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(209,249,7,1) 1%,rgba(129,198,1,1) 100%); /* Chrome10+,Safari5.1+ */ 
	background: -o-linear-gradient(top,  rgba(209,249,7,1) 1%,rgba(129,198,1,1) 100%); /* Opera 11.10+ */ 
	background: -ms-linear-gradient(top,  rgba(209,249,7,1) 1%,rgba(129,198,1,1) 100%); /* IE10+ */ 
	background: linear-gradient(top,  rgba(209,249,7,1) 1%,rgba(129,198,1,1) 100%); /* W3C */ 
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1f907', endColorstr='#81c601',GradientType=0 ); /* IE6-9 */
	
	border-color: #d1f907; color: #395801; 
	
	box-shadow: 0 15px 19px -10px #333, 0px 1px 1px 0px #EEFFB9 inset, 0 -1px 2px -1px #000 inset; 
	text-shadow: 0 1px 0 #FFF; 
	
}

#container a.button.resume {
	
	background: rgb(79,204,249); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(79,204,249,1) 1%, rgba(35,154,251,1) 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(1%,rgba(79,204,249,1)), color-stop(100%,rgba(35,154,251,1))); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top,  rgba(79,204,249,1) 1%,rgba(35,154,251,1) 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top,  rgba(79,204,249,1) 1%,rgba(35,154,251,1) 100%); /* Opera 11.10+ */
	background: -ms-linear-gradient(top,  rgba(79,204,249,1) 1%,rgba(35,154,251,1) 100%); /* IE10+ */
	background: linear-gradient(top,  rgba(79,204,249,1) 1%,rgba(35,154,251,1) 100%); /* W3C */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4fccf9', endColorstr='#239afb',GradientType=0 ); /* IE6-9 */

	border-color: #239afb;
	color: #023D6C;
	box-shadow: 0 15px 19px -10px #333, 0px 1px 1px 0px #E8F4FF inset, 0 -1px 2px -1px #000 inset;
	text-shadow: 0 1px 0 #FFF;
		
}





#portfolio #container #mainHead { } 
#portfolio #container #mainHead h1 { background: url(../images/simey-small.png) no-repeat; margin-top: 20px; width: 440px; }
#portfolio #container #mainHead h1 a { display: block; height: 170px; text-indent: -999em; }
#portfolio #container #mainHead p { font-size: 1.5em; font-weight: 700; color: #333; position: absolute; left: 59px; top: 105px; }

#portfolio #container nav { width: 200px; position: absolute; right: 20px; top: 70px; }
#portfolio #container nav a.button { float: right; margin: 0 0 10px 0;}

#portfolio #container #main { border-top: 1px solid #999; }
#portfolio #container #main h2 { position: absolute; left: -9999em; top: -9999em; }

#portfolio #container #main .site { 
	padding: 20px; background: white; border-radius: 5px;
	border: 1px solid #CCC;margin-top: 20px; box-shadow: 0 32px 62px -41px #000; position: relative;
	
-webkit-transition: border 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
   -moz-transition: border 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
	-ms-transition: border 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
	 -o-transition: border 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); 
		transition: border 500ms cubic-bezier(0.785, 0.135, 0.150, 0.860); /* easeInOutCirc */
}

#portfolio #container #main .site:hover { border-color: #FF4000; }

#portfolio #container #main .site header { margin: 0px; padding: 0px; position:relative; }
#portfolio #container #main .site header h3 { margin: 0px 0px 5px; padding: 5px 20px; border-bottom: 1px dotted #999;font-size: 1.5em; color: #FF4000; }
#portfolio #container #main .site header .button {  background: #666666; box-shadow: none; color: #FFFFFF; line-height: 2em; margin: 0; padding: 0 0.8em; position: absolute; right: -10px; text-shadow: 0 -1px 0 #666666; top: -10px; }
#portfolio #container #main .site header .button:hover {  background:#FF4000; color: #FFF; text-shadow: none; }
#portfolio #container #main .site .images { width: 210px; float: left; margin-top: 10px; }
#portfolio #container #main .site .images .screenshot { margin-bottom: 5px; }
#portfolio #container #main .site .images .thumbs a:first-child { margin-right: 5px; }
#portfolio #container #main .site .description { width: 520px; float: left; padding: 0 0 0 10px; margin: 0px 0px 0px 10px; font-size: 1.2em; border-left: 1px dotted #999; }

#portfolio #container #main .site.min { float: left; width: 210px; margin-right: 10px; cursor: pointer; }
#portfolio #container #main .site.min:nth-child(3n+1) { margin-right: 0; }
#portfolio #container #main .site.min .description { display:none; }
#portfolio #container #main .site.min header h3 { height:60px; }
#portfolio #container #main .site.min header .button { display:none; }

#portfolio #container #main .site.min.hide { opacity: 0; position:absolute; top: -999em; left: -999em; }