/*loadingAnimation*/
@-webkit-keyframes loadingAnimation {
	0% {-webkit-transform: rotate(0deg); opacity: 0.5;}
	90% {-webkit-transform: rotate(360deg); opacity: 0.7;}
	100% {-webkit-transform: rotate(360deg); opacity: 1;}
}
@-moz-keyframes loadingAnimation {
	0% {-moz-transform: rotate(0deg); opacity: 0.5;}
	90% {-moz-transform: rotate(360deg); opacity: 0.7;}
	100% {-moz-transform: rotate(360deg); opacity: 1;}
}
@-o-keyframes loadingAnimation {
	0% {-o-transform: rotate(0deg); opacity: 0.5;}
	90% {-o-transform: rotate(360deg); opacity: 0.7;}
	100% {-o-transform: rotate(360deg); opacity: 1;}
}
@-ms-keyframes loadingAnimation {
	0% {-ms-transform: rotate(0deg); opacity: 0.5;}
	90% {-ms-transform: rotate(360deg); opacity: 0.7;}
	100% {-ms-transform: rotate(360deg); opacity: 1;}
}
@keyframes loadingAnimation {
	0% {transform: rotate(0deg); opacity: 0.5;}
	90% {transform: rotate(360deg); opacity: 0.7;}
	100% {transform: rotate(360deg); opacity: 1;}
}


/*changeBackgroundForD*/
@-webkit-keyframes changeBackgroundForD {
	0% { background-color: #e0dfdc; }
	90% { background-color: #aaa9a7; }
	100% { background-color: #aaa9a7; }
}
@-moz-keyframes changeBackgroundForD {
	0% { background-color: #e0dfdc; }
	90% { background-color: #aaa9a7; }
	100% { background-color: #aaa9a7; }
}
@-o-keyframes changeBackgroundForD {
	0% { background-color: #e0dfdc; }
	90% { background-color: #aaa9a7; }
	100% { background-color: #aaa9a7; }
}
@-ms-keyframes changeBackgroundForD {
	0% { background-color: #e0dfdc; }
	90% { background-color: #aaa9a7; }
	100% { background-color: #aaa9a7; }
}
@keyframes changeBackgroundForD {
	0% { background-color: #e0dfdc; }
	90% { background-color: #aaa9a7; }
	100% { background-color: #aaa9a7; }
}


/*header*/
.myImgFadeInRight {
	-webkit-animation: myImgFadeInRight 2s forwards;
	-moz-animation: myImgFadeInRight 2s forwards;
	-o-animation: myImgFadeInRight 2s forwards;
	-ms-animation: myImgFadeInRight 2s forwards;
	animation: myImgFadeInRight 2s forwards;
}

@-webkit-keyframes myImgFadeInRight {
	from { -webkit-transform: translateX(400px); opacity: 0; }
	to { -webkit-transform: translateX(0); opacity: 1; }
}
@-moz-keyframes myImgFadeInRight {
	from { -moz-transform: translateX(400px); opacity: 0; }
	to { -moz-transform: translateX(0); opacity: 1; }
}
@-o-keyframes myImgFadeInRight {
	from { -o-transform: translateX(400px); opacity: 0; }
	to { -o-transform: translateX(0); opacity: 1; }
}
@-ms-keyframes myImgFadeInRight {
	from { -ms-transform: translateX(400px); opacity: 0; }
	to { -ms-transform: translateX(0); opacity: 1; }
}
@keyframes myImgFadeInRight {
	from { transform: translateX(400px); opacity: 0; }
	to { transform: translateX(0); opacity: 1; }
}

/*education*/
.educationBorderFade {
	/*-webkit-ani*/
}

@-webkit-keyframes educationBorderFade {
	from { opacity: 0; }
	to { opacity: 1; }
}


/*technical-skill*/
.kata-1 {
	-webkit-animation: rotatingKata1 4s ease-in-out forwards;
	-moz-animation: rotatingKata1 4s ease-in-out forwards;
	-o-animation: rotatingKata1 4s ease-in-out forwards;
	-ms-animation: rotatingKata1 4s ease-in-out forwards;
	animation: rotatingKata1 4s ease-in-out forwards;
}

.kata-2 {
	-webkit-animation: rotatingKata2 4s ease-in-out forwards;
	-moz-animation: rotatingKata2 4s ease-in-out forwards;
	-o-animation: rotatingKata2 4s ease-in-out forwards;
	-ms-animation: rotatingKata2 4s ease-in-out forwards;
	animation: rotatingKata2 4s ease-in-out forwards;
}

.kata-3 {
	-webkit-animation: rotatingKata3 4s ease-in-out forwards;
	-moz-animation: rotatingKata3 4s ease-in-out forwards;
	-o-animation: rotatingKata3 4s ease-in-out forwards;
	-ms-animation: rotatingKata3 4s ease-in-out forwards;
	animation: rotatingKata3 4s ease-in-out forwards;
}

.kata-4 {
	-webkit-animation: rotatingKata4 4s ease-in-out forwards;
	-moz-animation: rotatingKata4 4s ease-in-out forwards;
	-o-animation: rotatingKata4 4s ease-in-out forwards;
	-ms-animation: rotatingKata4 4s ease-in-out forwards;
	animation: rotatingKata4 4s ease-in-out forwards;
}

.kata-5 {
	-webkit-animation: rotatingKata5 4s ease-in-out forwards;
	-moz-animation: rotatingKata5 4s ease-in-out forwards;
	-o-animation: rotatingKata5 4s ease-in-out forwards;
	-ms-animation: rotatingKata5 4s ease-in-out forwards;
	animation: rotatingKata5 4s ease-in-out forwards;
}

.kata-6 {
	-webkit-animation: rotatingKata6 4s ease-in-out forwards;
	-moz-animation: rotatingKata6 4s ease-in-out forwards;
	-o-animation: rotatingKata6 4s ease-in-out forwards;
	-ms-animation: rotatingKata6 4s ease-in-out forwards;
	animation: rotatingKata6 4s ease-in-out forwards;
}

.kata-7 {
	-webkit-animation: rotatingKata7 4s ease-in-out forwards;
	-moz-animation: rotatingKata7 4s ease-in-out forwards;
	-o-animation: rotatingKata7 4s ease-in-out forwards;
	-ms-animation: rotatingKata7 4s ease-in-out forwards;
	animation: rotatingKata7 4s ease-in-out forwards;
}

.kata-8 {
	-webkit-animation: rotatingKata8 4s ease-in-out forwards;
	-moz-animation: rotatingKata8 4s ease-in-out forwards;
	-o-animation: rotatingKata8 4s ease-in-out forwards;
	-ms-animation: rotatingKata8 4s ease-in-out forwards;
	animation: rotatingKata8 4s ease-in-out forwards;
}

/*kata-1*/
@-webkit-keyframes rotatingKata1 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(338deg); }
}
@-moz-keyframes rotatingKata1 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(338deg); }
}
@-o-keyframes rotatingKata1 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(338deg); }
}
@-ms-keyframes rotatingKata1 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(338deg); }
}
@keyframes rotatingKata1 {
	from { transform: rotate(0deg); }
	to { transform: rotate(338deg); }
}

/*kata-2*/
@-webkit-keyframes rotatingKata2 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(301deg); }
}
@-moz-keyframes rotatingKata2 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(301deg); }
}
@-o-keyframes rotatingKata2 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(301deg); }
}
@-ms-keyframes rotatingKata2 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(301deg); }
}
@keyframes rotatingKata2 {
	from { transform: rotate(0deg); }
	to { transform: rotate(301deg); }
}


/*kata-3*/
@-webkit-keyframes rotatingKata3 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(230deg); }
}
@-moz-keyframes rotatingKata3 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(230deg); }
}
@-o-keyframes rotatingKata3 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(230deg); }
}
@-ms-keyframes rotatingKata3 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(230deg); }
}
@keyframes rotatingKata3 {
	from { transform: rotate(0deg); }
	to { transform: rotate(230deg); }
}


/*kata-4*/
@-webkit-keyframes rotatingKata4 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(338deg); }
}
@-moz-keyframes rotatingKata4 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(338deg); }
}
@-o-keyframes rotatingKata4 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(338deg); }
}
@-ms-keyframes rotatingKata4 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(338deg); }
}
@keyframes rotatingKata4 {
	from { transform: rotate(0deg); }
	to { transform: rotate(338deg); }
}


/*kata-5*/
@-webkit-keyframes rotatingKata5 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(338deg); }
}
@-moz-keyframes rotatingKata5 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(338deg); }
}
@-o-keyframes rotatingKata5 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(338deg); }
}
@-ms-keyframes rotatingKata5 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(338deg); }
}
@keyframes rotatingKata5 {
	from { transform: rotate(0deg); }
	to { transform: rotate(338deg); }
}


/*kata-6*/
@-webkit-keyframes rotatingKata6 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(213deg); }
}
@-moz-keyframes rotatingKata6 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(213deg); }
}
@-o-keyframes rotatingKata6 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(213deg); }
}
@-ms-keyframes rotatingKata6 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(213deg); }
}
@keyframes rotatingKata6 {
	from { transform: rotate(0deg); }
	to { transform: rotate(213deg); }
}


/*kata-7*/
@-webkit-keyframes rotatingKata7 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(250deg); }
}
@-moz-keyframes rotatingKata7 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(250deg); }
}
@-o-keyframes rotatingKata7 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(250deg); }
}
@-ms-keyframes rotatingKata7 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(250deg); }
}
@keyframes rotatingKata7 {
	from { transform: rotate(0deg); }
	to { transform: rotate(250deg); }
}


/*kata-8*/
@-webkit-keyframes rotatingKata8 {
	from { -webkit-transform: rotate(0deg); }
	to { -webkit-transform: rotate(338deg); }
}
@-moz-keyframes rotatingKata8 {
	from { -moz-transform: rotate(0deg); }
	to { -moz-transform: rotate(338deg); }
}
@-o-keyframes rotatingKata8 {
	from { -o-transform: rotate(0deg); }
	to { -o-transform: rotate(338deg); }
}
@-ms-keyframes rotatingKata8 {
	from { -ms-transform: rotate(0deg); }
	to { -ms-transform: rotate(338deg); }
}
@keyframes rotatingKata8 {
	from { transform: rotate(0deg); }
	to { transform: rotate(338deg); }
}



/*fadeInBottom*/
.fadeInBottom {
	-webkit-animation: fadeInBottom 2s forwards;
	-moz-animation: fadeInBottom 2s forwards;
	-o-animation: fadeInBottom 2s forwards;
	-ms-animation: fadeInBottom 2s forwards;
	animation: fadeInBottom 2s forwards;
}

@-webkit-keyframes fadeInBottom {
	from { -webkit-transform: translateY(50px); opacity: 0; }
	to { -webkit-transform: translateY(0px); opacity: 1; }
}
@-moz-keyframes fadeInBottom {
	from { -moz-transform: translateY(50px); opacity: 0; }
	to { -moz-transform: translateY(0px); opacity: 1; }
}
@-o-keyframes fadeInBottom {
	from { -o-transform: translateY(50px); opacity: 0; }
	to { -o-transform: translateY(0px); opacity: 1; }
}
@-ms-keyframes fadeInBottom {
	from { -ms-transform: translateY(50px); opacity: 0; }
	to { -ms-transform: translateY(0px); opacity: 1; }
}
@keyframes fadeInBottom {
	from { transform: translateY(50px); opacity: 0; }
	to { transform: translateY(0px); opacity: 1; }
}

/*fadeInLeft*/
.fadeInLeft {
	-webkit-animation: fadeInLeft 2s forwards;
	-moz-animation: fadeInLeft 2s forwards;
	-o-animation: fadeInLeft 2s forwards;
	-ms-animation: fadeInLeft 2s forwards;
	animation: fadeInLeft 2s forwards;
}

@-webkit-keyframes fadeInLeft {
	from { -webkit-transform: translateX(-50px); opacity: 0; }
	to { -webkit-transform: translateX(0px); opacity: 1; }
}
@-moz-keyframes fadeInLeft {
	from { -moz-transform: translateX(-50px); opacity: 0; }
	to { -moz-transform: translateX(0px); opacity: 1; }
}
@-o-keyframes fadeInLeft {
	from { -o-transform: translateX(-50px); opacity: 0; }
	to { -o-transform: translateX(0px); opacity: 1; }
}
@-ms-keyframes fadeInLeft {
	from { -ms-transform: translateX(-50px); opacity: 0; }
	to { -ms-transform: translateX(0px); opacity: 1; }
}
@keyframes fadeInLeft {
	from { transform: translateX(-50px); opacity: 0; }
	to { transform: translateX(0px); opacity: 1; }
}

/*fadeInRight*/
.fadeInRight {
	-webkit-animation: fadeInRight 2s forwards;
	-moz-animation: fadeInRight 2s forwards;
	-o-animation: fadeInRight 2s forwards;
	-ms-animation: fadeInRight 2s forwards;
	animation: fadeInRight 2s forwards;
}

@-webkit-keyframes fadeInRight {
	from { -webkit-transform: translateX(50px); opacity: 0; }
	to { -webkit-transform: translateX(0px); opacity: 1; }
}
@-moz-keyframes fadeInRight {
	from { -moz-transform: translateX(50px); opacity: 0; }
	to { -moz-transform: translateX(0px); opacity: 1; }
}
@-o-keyframes fadeInRight {
	from { -o-transform: translateX(50px); opacity: 0; }
	to { -o-transform: translateX(0px); opacity: 1; }
}
@-ms-keyframes fadeInRight {
	from { -ms-transform: translateX(50px); opacity: 0; }
	to { -ms-transform: translateX(0px); opacity: 1; }
}
@keyframes fadeInRight {
	from { transform: translateX(50px); opacity: 0; }
	to { transform: translateX(0px); opacity: 1; }
}



/*contact*/
.scaleSubmitButton {
	-webkit-animation: scaleSubmitButton 1.5s forwards;
	-moz-animation: scaleSubmitButton 1.5s forwards;
	-o-animation: scaleSubmitButton 1.5s forwards;
	-ms-animation: scaleSubmitButton 1.5s forwards;
	animation: scaleSubmitButton 1.5s forwards;
}

@-webkit-keyframes scaleSubmitButton {
	from { -webkit-transform: scale(0,0); opacity: 0; }
	to { -webkit-transform: scale(1,1); opacity: 1; }
}
@-moz-keyframes scaleSubmitButton {
	from { -moz-transform: scale(0,0); opacity: 0; }
	to { -moz-transform: scale(1,1); opacity: 1; }
}
@-0-keyframes scaleSubmitButton {
	from { -0-transform: scale(0,0); opacity: 0; }
	to { -0-transform: scale(1,1); opacity: 1; }
}
@-ms-keyframes scaleSubmitButton {
	from { -ms-transform: scale(0,0); opacity: 0; }
	to { -ms-transform: scale(1,1); opacity: 1; }
}
@keyframes scaleSubmitButton {
	from { transform: scale(0,0); opacity: 0; }
	to { transform: scale(1,1); opacity: 1; }
}



/*some of my work animations*/
.galleryanimationleft  {
	-webkit-animation: galleryanimationleft 1.2s ease-in-out;
	-moz-animation: galleryanimationleft 1.2s ease-in-out;
	-o-animation: galleryanimationleft 1.2s ease-in-out;
	-ms-animation: galleryanimationleft 1.2s ease-in-out;
	animation: galleryanimationleft 1.2s ease-in-out;
}

.galleryanimationtop {
	-webkit-animation: galleryanimationtop 1.2s ease-in-out;
	-moz-animation: galleryanimationtop 1.2s ease-in-out;
	-o-animation: galleryanimationtop 1.2s ease-in-out;
	-ms-animation: galleryanimationtop 1.2s ease-in-out;
	animation: galleryanimationtop 1.2s ease-in-out;
}

.galleryanimationright {
	-webkit-animation: galleryanimationright 1.2s ease-in-out;
	-moz-animation: galleryanimationright 1.2s ease-in-out;
	-o-animation: galleryanimationright 1.2s ease-in-out;
	-ms-animation: galleryanimationtop 1.2s ease-in-out;
	animation: galleryanimationright 1.2s ease-in-out;
}


@-webkit-keyframes galleryanimationleft {
	from { -webkit-transform: translateX(-999px); }
	to { -webkit-transform: translateX(0px); }
}

@-moz-keyframes galleryanimationleft {
	from { -moz-transform: translateX(-999px); }
	to { -moz-transform: translateX(0px); }
}

@-o-keyframes galleryanimationleft {
	from { -o-transform: translateX(-999px); }
	to { -o-transform: translateX(0px); }
}

@-ms-keyframes galleryanimationleft {
	from { -ms-transform: translateX(-999px); }
	to { -ms-transform: translateX(0px); }
}

@keyframes galleryanimationleft {
	from { transform: translateX(-999px); }
	to { transform: translateX(0px); }
}


@-webkit-keyframes galleryanimationright {
	from { -webkit-transform: translateX(999px); }
	to { -webkit-transform: translateX(0px); }
}

@-moz-keyframes galleryanimationright {
	from { -moz-transform: translateX(999px); }
	to { -moz-transform: translateX(0px); }
}

@-o-keyframes galleryanimationright {
	from { -o-transform: translateX(999px); }
	to { -o-transform: translateX(0px); }
}

@-ms-keyframes galleryanimationright {
	from { -ms-transform: translateX(999px); }
	to { -ms-transform: translateX(0px); }
}

@keyframes galleryanimationright {
	from { transform: translateX(999px); }
	to { transform: translateX(0px); }
}


@-webkit-keyframes galleryanimationtop {
	from { -webkit-transform: translateY(-999px); }
	to { -webkit-transform: translateY(0px); }
}

@-moz-keyframes galleryanimationtop {
	from { -moz-transform: translateY(-999px); }
	to { -moz-transform: translateY(0px); }
}

@-ms-keyframes galleryanimationtop {
	from { -ms-transform: translateY(-999px); }
	to { -ms-transform: translateY(0px); }
}

@-o-keyframes galleryanimationtop {
	from { -o-transform: translateY(-999px); }
	to { -o-transform: translateY(0px); }
}

@keyframes galleryanimationtop {
	from { transform: translateY(-999px); }
	to { transform: translateY(0px); }
}