/* for the elements that need to be removed out of the flow and out of the screen */

#mod-invitation .removed {
	position: absolute; left: -9999px; text-indent: -9999px; font-size: 0 !important; height: 0; line-height: 0; }


/* =tags */

#mod-invitation a {
    color: #333;
    font-weight: bold; text-decoration: none; }

#mod-invitation a:hover,
#mod-invitation a:active {
    color: #000;  }

#mod-invitation em {
    font-style: normal; font-weight: bold;  }


/* =invitation */

#mod-invitation {
	position: relative; width: 920px; min-height: 300px; _height: 800px; max-height: 800px; padding: 80px 0 30px;
	background: #fff; }


/* invitation-nav */

#mod-invitation #invitation-nav {
	position: absolute; left: 0; top: 0; width: 460px; height: 60px; overflow: hidden; }

#mod-invitation #invitation-nav li {
	display: block; float: left; overflow: hidden; }

#mod-invitation #invitation-nav a {
    display: block; width: 153px; height: 60px;  
	font-size: 1.4em; font-weight: bold; line-height: 60px; text-align: center; color: #fff;
	background-color: #AD2025; }

#mod-invitation #invitation-nav li:first-child + li a {
	width: 154px; }

#mod-invitation #invitation-nav a:hover {
	background-color: #d71920; }
#mod-invitation #invitation-nav .last a:hover {
	background-color: #AD2025; }

#mod-invitation #invitation-nav .selected a {
	background: #fff; color: #AD2025; }


/* =source, =destination */

#mod-invitation .source,
#mod-invitation .destination {
	float: left; display: inline; }

#mod-invitation .source {
	width: 399px; margin: 0 0 0 30px; padding: 0 20px 0 10px;
	border-right: 1px solid #ccc; }

#mod-invitation .destination {
	margin-left: -1px; width: 405px; padding: 0 0 0 30px;
	border-left: 1px solid #ccc; }

#mod-invitation .destination h3 {
	position: absolute; right: 0; top: 0; width: 460px; height: 60px; padding-bottom: 19px;
	font: bold 16px Helvetica, Arial, sans-serif; line-height: 60px; text-align: center; color: #fff;
	background: #AD2025  no-repeat 50% 79px; border-left: 2px solid #fff; }


#mod-invitation .destination h3 b {
	position: absolute; right: 0 /*217px*/; bottom: 0; /* top: 60px; */ width: 460px /*25px*/; height: 19px;
	text-indent: -9999px;
	background: #fff; }

#mod-invitation .destination:hover h3 b {
	background-position: 50% -19px; }


/* =invitation-form */

#mod-invitation .invitation-form {
	position: relative; }

#mod-invitation .invitation-form legend {
	padding-bottom: 10px;
	font-size: 1.4em; font-weight: bold;
	color: #736a2e; }

#mod-invitation .invitation-form label {
	float: left; margin: 9px 15px 0 0;
	font-size: 1.1em; font-weight: bold; text-transform: uppercase;
	color: #000; }

#mod-invitation .invitation-form span {
	display: block; float: left;}

#mod-invitation .invitation-form input,
#mod-invitation .invitation-form textarea {
	margin: 0; padding: 4px;
	border: 1px solid #c2cacc; color: #333 /*#bbb*/; }

#mod-invitation .invitation-form input {
	width: 210px; height: 14px;
	font-size: 1.2em; font-family: Arial, Helvetica, sans-serif; }

/*.invitation-form input:focus {
	color: #333; }*/

#mod-invitation .invitation-form .textarea label {
	margin-bottom: 10px; }

#mod-invitation .invitation-form .textarea span {
	clear: left; position: relative; }

#mod-invitation .invitation-form .textarea b {
	position: absolute;	left: 4px; bottom: -25px;
	font: italic normal 1em Georgia, "Times New Roman", Times, serif;
	color: #999; }

#mod-invitation .invitation-form textarea {
	overflow: auto;
	font: 1.2em normal Arial, Helvetica, sans-serif;
	color: #333; }

#mod-invitation .invitation-form select {
	padding: 1px;
	font: normal 1em Arial, Helvetica, sans-serif; }

/*#mod-invitation button {
	display: block; clear: left; width: 160px; height: 29px; margin-top: 15px;
	text-indent: -9999px;
	border: 0; background: url(../../../images/stt/invite/btn_send_invitation.png) no-repeat; cursor: pointer; }

#mod-invitation button:hover {
	background-position: 0 -29px; }*/


/* =btn-import */

#mod-invitation .btn-import {
	 color: #fff; font-weight: bold; padding: 5px 10px;  font-size: 14px;
	background: #AD2025; }
#mod-invitation .btn-import:active { background: #d71920;}


/* =invitation-form | in destination div */

#mod-invitation .destination .invitation-form {
	margin-left: -10px; }

#mod-invitation .destination .invitation-form label {
	margin-top: 0; margin-right: 0; }

#mod-invitation .destination .invitation-form textarea {
	width: 402px; }

#mod-invitation .destination button {
	float: right; margin-right: -3px }


/* =quick-search-form */

#mod-invitation .quick-search-form {
	padding: 0 0 20px;
	border-bottom: 1px dotted #c2cacc; }


/* =stats */

#mod-invitation .stats {
	float: left; margin-bottom: 20px;
	font-size: 1.1em;
	color: #999; }

#mod-invitation .source .stats {
	margin-top: 20px; }


/* =add, =remove */

#mod-invitation .add,
#mod-invitation .remove {
	position: relative; float: right; margin-top: 20px;
	font-size: 1.1em; font-weight: bold; line-height: normal; text-transform: uppercase;
	color: #fff; -moz-border-radius: 9px; -webkit-border-radius: 8px; }

/*.contacts-list .add, .contacts-list .remove {
	-webkit-transition: background-color .5s linear; }*/

#mod-invitation .add:hover,
#mod-invitation .remove:hover {
	color: #fff; }

#mod-invitation .add {
	padding: 2px 20px 2px 7px;
	background: #AD2025; }

#mod-invitation .remove {
	padding: 2px 7px 2px 20px;
	background: #ff897f; }

#mod-invitation .add:hover {
	background: #d71920; }

#mod-invitation .remove:hover {
	background: #cc3629; }

#mod-invitation .add b,
#mod-invitation .remove b {
	position: absolute; top: 1px; cursor: pointer; }

#mod-invitation .add b {
	right: 6px; }

#mod-invitation .remove b {
	left: 6px; }

#mod-invitation .destination .remove {
	margin-top: 0; }


/* =contacts-list */

#mod-invitation .contacts-list {
	position: relative; z-index: 10; clear: both; width: auto; margin: 0 0 20px -10px; height: 376px; overflow: auto; }

#mod-invitation .your-friends .contacts-list {
	height: auto;
	max-height: 470px; }

#mod-invitation #web-net .contacts-list {
	height: auto;
	max-height: 282px; }

#mod-invitation .destination .contacts-list {
	height: 300px; }

#mod-invitation .contacts-list li {
	position: relative; z-index: 1; display: block; }

#mod-invitation .contacts-list a {
	position: relative; z-index: 5; display: block; padding: 5px 10px; zoom: 1;
	font-size: 1.2em; line-height: 1.5em;
	border-bottom: 1px solid #eee; }

#mod-invitation .contacts-list a:hover {
	background: #ffffd9; }

#mod-invitation .contacts-list a:active {
	background: #fffbcc; }

#mod-invitation .contacts-list span {
	font-size: .9em; font-weight: normal; }

/*.contacts-list em {
	position: absolute; right: 9999px; top: 33%; cursor: pointer; float: none; margin-top: 0;
	font-size: .9em; line-height: normal; }

.contacts-list a:hover em {
	right: 10px; }*/

#mod-invitation .contacts-list a:hover .add {
	background-color: #84993d; }

#mod-invitation .contacts-list a:hover .remove {
	background-color: #cc3629; }


/* =inv-add, =inv-remove */

#mod-invitation .contacts-list .inv-add a,
#mod-invitation .contacts-list .inv-remove a {
	background-position: 9999px 9999px; background-repeat: no-repeat; }

#mod-invitation .contacts-list .inv-add a {
	background-image: url(../../../images/stt/invite/ico_plus_green.png); }

#mod-invitation .contacts-list .inv-remove a {
	background-image: url(../../../images/stt/invite/ico_minus_red.png); }

#mod-invitation .contacts-list .inv-add:hover a {
	background-position: 97% 50%; }

#mod-invitation .contacts-list .inv-remove:hover a {
	background-position: 97% 50%; }


/* =cancel */

#mod-invitation .cancel {
	/*float: left; clear: left;*/ padding-right: 20px; position: absolute; bottom: 40px; left: 30px;
	font-size: 1.4em; font-weight: bold; text-transform: capitalize;
	background: url(../../../images/stt/invite/ico_delete.png) no-repeat 100% 55%; color: #000; border: 0; }

#mod-invitation .cancel:hover {
	color: #155969; }
#mod-invitation .cancel:active { position: absolute; top: auto;}


/* =IMPORT-CONTACTS
-----------------------------------------------------------*/


/* =import-nav */

#mod-invitation #import-nav {
	margin: 0 0 20px; }

#mod-invitation #import-nav li {
	display: block; float: left; position: relative; margin-right: 20px; }

#mod-invitation #import-nav li:last-child { margin-right: 0; }

#mod-invitation #import-nav li b {
	display: none; }

#mod-invitation #import-nav .selected b { display: block; position: absolute; left: 45%; top: 20px; width: 15px; height: 11px;
	text-indent: -9999px;
	background: #fff; }

#mod-invitation #import-nav .selected:hover b {
	}

#mod-invitation #import-nav a { display: block; padding: 4px 10px;
	font-size: 1.1em; text-transform: uppercase; white-space: nowrap; border: 0;
	color: #333; }

#mod-invitation #import-nav a:hover {
	background-color: #cee9f2; }

#mod-invitation #import-nav .selected a {
	color: #333; }

#mod-invitation #import-nav .selected a:hover {
	background-color: #fff; }


/* web-net-list */

#mod-invitation #web-net-list {
	position: relative; width: 285px; padding: 13px 0 5px; }

#mod-invitation #web-net-list li {
	display: block; float: left; width: 76px; height: 28px; padding: 0 12px 12px 0; }

#mod-invitation #web-net-list a {
	display: block; width: 76px; height: 28px;
	border: 1px solid #e7e7e7; -moz-border-radius: 3px; -moz-box-shadow: 0 0 3px #e6e6e6; -webkit-box-shadow: 0 0 3px #e6e6e6; -webkit-transition-property: -webkit-box-shadow, border-color; -webkit-transition-duration: .1s, .1s; -webkit-transition-timing-function: linear }

#mod-invitation #web-net-list a:hover {
	-moz-box-shadow: 0 0 0 #fff; -webkit-box-shadow: 0 0 0 #fff; border-color: #ccc; }

#mod-invitation #web-net-list .selected a {
	-moz-box-shadow: 0 0 8px #ffee33; -webkit-box-shadow: 0 0 8px #ffee33; border-color: #ede7a6; }

#mod-invitation #web-net-list em {
	position: absolute; left: -9999px; }

#mod-invitation #web-net-list .last {
	width: 126px; float: none; height: auto; padding: 0; position: absolute; left: 268px; top: 12px;
	border: 1px solid #fff; }

#mod-invitation #web-net-list .last select {
	width: 125px; padding: 3px 3px 3px 7px;
	font-size: 1.1em;
	border: 1px solid #C2CACC; color: #6e7371; }


/* =web-login */

#mod-invitation .web-login {
	padding: 10px 0;
	border: 1px dotted #c2cacc; border-left: 0; border-right: 0; }

#mod-invitation .web-login .element-wrap {
	margin-bottom: 10px; }

#mod-invitation .web-login .element-wrap label {
	width: 65px; }

#mod-invitation .web-login .element-wrap input {
	float: none; width: 177px; }

#mod-invitation .web-login .hint,
#mod-invitation .web-login button {
	position: absolute; left: 287px; }

#mod-invitation .web-login .hint {
	top: 40px; padding: 4px 8px;
	text-transform: uppercase;
	background: #fff799; color: #665800; -moz-border-radius: 2px; -webkit-border-radius: 2px; }

#mod-invitation .web-login button {
	top: 62px; }


/* =contacts-file */

#mod-invitation .contacts-file {
	padding: 10px 0 15px;
	border-bottom: 1px dotted #c2cacc; }

#mod-invitation .contacts-file input {
	width: 280px !important; }

#mod-invitation .contacts-file span div,
#mod-invitation .contacts-file span div input {
	width: 95px !important; height: 22px !important; margin-left: 0 !important; }

#mod-invitation .contacts-file span div {
	margin-left: 15px !important; }

#mod-invitation .contacts-file .hint {
	clear: both; padding: 5px 0 0;
	font-size: 1.1em;
	color: #999; }


/* =ENTER-EMAIL
-----------------------------------------------------------*/

#mod-invitation .enter-email {
	padding: 0 30px 0 0; }

#mod-invitation .enter-email .invitation-form {
	position: relative; }

#mod-invitation .enter-email .invitation-form .input {
	float: left; width: 190px; margin-bottom: 5px; padding: 5px 0 15px 15px; _padding-left: 0;
	border: 1px dotted #c2cacc; border-left: 0; border-right: 0; border-top: 0; }

#mod-invitation .enter-email .invitation-form .input:first-child {
	padding-left: 0; }

#mod-invitation .enter-email .invitation-form .input label {
	width: 70px; margin-bottom: 10px; }

#mod-invitation .enter-email .invitation-form input { width: 175px; }

#mod-invitation .enter-email .invitation-form .add {
	position: absolute; right: 5px; top: -10px; }

#mod-invitation .enter-email .invitation-form .textarea {
	clear: left; }

#mod-invitation .enter-email .invitation-form textarea {
	width: 380px; }

#mod-invitation .enter-email button {
	float: right; margin-right: 3px; }

#mod-invitation .enter-email .cancel {
	/*float: none;*/ position: absolute; bottom: 25px; left: 30px; }


/* =no-form */

/*.no-form .contacts-list {
	height: auto;
	max-height: 470px; }

.no-form .invitation-form {
	display: none; }*/


/* =nyroModal
-----------------------------------------------------------------------------*/

div.nyroModalFull {
    z-index: 300; position: static !important;
    font-size: 10px; }

.nyroModalFull .nyroModalCont { height: 760px !important; position: absolute !important; overflow: hidden !important;}




/* --------- =SWITCHES | simulacija paljenja i gasenja elemenata koju treba implmenetirati u javascript-u --------- */


/* prvi tab */
#mod-invitation .your-friends {
	display: none; }

/* drugi tab */
#mod-invitation .import-contacts {
	xdisplay: none; }

	/* prvi podtab */
	#web-net {
		/*display: none;*/ }

	/* drugi podtab */
	#address-book {
		display: none; }

/* treci tab */
#mod-invitation .enter-email {
	display: none; }

/* ----------------------------------------------------------------------------------------------------------------- */

#mod-invitation #fnc-inv-submitted-loader {
    padding: 26px 0 0 95px;
    border: 0; background: none; }

#mod-invitation #fnc-inv-grabber-animation {
    float: left; position: absolute; top: 13px; left: 85px;
    border: 0; background: none; }


#mod-invitation button {
	border:0px;
	padding:8px 10px;
	display:block; font-size: 16px; font-weight: bold;
	cursor:pointer; color: #fff; border-radius: 5px;
	background: #AD2025;
}

#mod-invitation button { margin-top: 15px; }


#mod-invitation button:hover  { background: #d71920;}