/*--------------------------------------------------*/
    /*       General styles for Welvi CMS               */
    /*--------------------------------------------------*/

    /*

        1 - General tags
        2 - Main container
        3 - Log In layout
        4 - Forms
        ? - Footer

    */

    /* 1- General tags */

        body {
            margin: 0;
            padding: 0;
            color: #666;
            font-size: 62.5%;
            font-family: 'Ubuntu', 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
            background-color: #333;
        }

        h1, h2, h3, h4, h5, h6 {
            margin: 0;
            padding: 0;
        }

        h1 {
            color: #333;
            font-size: 2.2em;
            float: left;
            margin-top: .5em;
        }

        h2 {
            color: #333;
            font-size: 1.6em;
            margin-bottom: .4em;
        }

            h2 span {
                font-size: .9em;
                font-weight: normal;
            }

            h2 span.mime-type {
                font-size: .7em;
                font-style: italic;
            }

        a.back {
            background: url('/static/images/back.png') no-repeat 0 .2em;
            padding-left: 2.1em !important;
            text-decoration: none;
            display: block;
            padding-top: 0;
            line-height: 1.6em;
        }

        a.accept {
            background: url('/static/images/accept.png') no-repeat 0 0;
            padding-left: 2.1em;
            padding-top: .2em;
            padding-bottom: .3em;
            text-decoration: none;
        }

        a.logout {
            background: url('/static/images/logout.png') no-repeat 0 1px;
            padding: .6em 0 .6em 2.1em;
            text-decoration: none;
        }

        a.cancel {
            background: url('/static/images/cancel.png') no-repeat 0 0;
            padding-left: 2.1em;
            padding-top: .2em;
            padding-bottom: .3em;
            text-decoration: none;
            margin-left: 1em;
        }

        h4 {
            font-size: 1.6em;
            margin: .4em 0;
            color: #000;
            font-weight: normal;
        }

        ul, li {
            margin: 0;
            padding: 0;
            list-style: none;
        }

        .hidden {
            display: none;
        }

        p {
            font-size: 1.4em;
            margin: .3em 0;
            padding: .2em 0;
        }

        p#commit-new-order-nodes {
            font-size: 1.4em;
        }

        p.accept-paragraph {
            border: 1px solid #f59334;
            background-color: #f9d4a2;
            padding: .5em;
            display: inline-block;
        }

        p.no-objects-to-add {
            margin-top: 1em;
            text-align: center;
            font-size: 1.4em;
        }

        a img {
            border: none;
        }

        a {
            color: #333;
        }

        a:hover {
            color: #333;
            text-decoration: none;
        }

        a.commit-link {
            text-decoration: none;
            padding: .4em;
            cursor: pointer;
            background-color: #555;
            border: 3px solid #555;
            -webkit-border-radius: 3px;
            -moz-border-radius: 3px;
            border-radius: 3px;
            color: #fff;
            display: inline-block;
            font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
        }

        .right {
            float: right;
        }

        .left {
            float: left;
        }

        .text-left {
            text-align: left !important;
        }

        .text-right {
            text-align: right !important;
        }

        li.odd {
            background-color: #eee;
        }

    /* 2- Main container */

        #container {
            width: 100%;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: #fff;
        }

            #container #breadcrumb,
            #container #breadcrumb ul {
                width: 100%;
                overflow: hidden;
                padding: 0;
                margin: 0;
            }

            #container #breadcrumb {
                background-color: #EEEEEE;
                border-top: 1px solid #CCCCCC;
                margin: 0 0 0.5em;
                padding: 1em 0 1em 1em;
            }

                #container #breadcrumb ul li {
                    display: block;
                    float: left;
                    margin-right: .3em;
                    padding-right: 1.3em;
                    font-size: 1.3em;
                    background: url('/static/images/breadcrumb.png') no-repeat right .45em;
                }

                    #container #breadcrumb ul li.selected {
                        background: none;
                    }

                    #container #breadcrumb ul li a {
                        color: #666;
                    }


    /* 3 - Log In layout */

        #container #login-header {
            width: 100%;
            height: 6em;
            margin-bottom: 1em;
            background-color: #ccc;
        }

            #container #login-header #logo {
                padding: .5em 0 0 1em;
            }

                #container #login-header #logo a {
                    color: #339933;
                    float: left;
                    margin-top: .4em;
                    text-decoration: none;
                }

                    #container #login-header #logo a span {
                        color: #666;
                    }

        #container .subline {
            margin: .6em 0;
            width: 100%;
            overflow: hidden;
            height: .3em;
            background: url('../images/bg-sub-header.gif') repeat-x top left;
        }

        #container #form-container {
            width: 38em;
            overflow: hidden;
            margin: 10em auto;
            padding: 2em 1em 1em 1em;
            background-color: #eee;
            -webkit-border-radius: 5px;
            -moz-border-radius: 5px;
            border-radius: 5px;
        }


            #container #form-container form div.field {
                width: 30em;
                overflow: hidden;
                margin: 0 0 .5em 0;
            }

            #container #form-container form.login div.field {
                width: 35em;
            }

                #container #form-container form div.field label {
                    font-size: 1.4em;
                    width: 5em;
                    text-align: left;
                    float: left;
                    color: #333;
                    padding: .5em !important;
                    font-weight: bold;
                    margin: 0;
                }

                #container #form-container form div.field input {
                    float: right;
                    font-size: 1.4em;
                    color: #666;
                    border: 2px solid #555;
                    width: 15.5em;
                    padding: .5em;
                    margin: 0;
                    -webkit-border-radius: 3px;
                    -moz-border-radius: 3px;
                    border-radius: 3px;
                    font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
                }

            #container #form-container form div.submit-field {
                margin-top: 2.5em;
                width: 35em;
                text-align: right;
            }

    /* 4 - Forms */

        form {
            width: 40em;
            padding: 0;
            margin: 0;
        }

            form.login fieldset {
                border: none;
                background-color: #eee;
            }

            form.login fieldset div.submit-field input {
                font-size: 1.4em;
                padding: .4em;
                cursor: pointer;
                margin-left: 1em;
                background-color: #555;
                border: 3px solid #555;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
                color: #fff;
                font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
            }

            form fieldset {
                -webkit-border-radius: 6px;
                -moz-border-radius: 6px;
                border-radius: 6px;
                background-color:#EEEEEE;
                border:none;
                margin:0;
                padding: .4em;
                width:99.5%;
            }

            form.add-nodes-search-form {
                width: 100%;
            }

                form.add-nodes-search-form fieldset {
                    width: 100%;
                }

                form.add-nodes-search-form .field input,
                form.add-nodes-search-form .field select {
                    width: 30em;
                }

            form .button {
                clear: left;
                float: left;
                margin: .7em 0;
            }

            form legend {
                display: none;
            }

            form span.description {
                font-size: .9em;
            }

            form .submit-field,
            form .submit {
                width: 100%;
                overflow: hidden;
                margin: 1.5em 0;
            }

            form .submit-field input,
            form .submit input,
            form input.button {
                font-size: 1.4em;
                padding: .4em;
                cursor: pointer;
                background-color: #555;
                border: 3px solid #555;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
                color: #fff;
                font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
            }

            form .field,
            form .text,
            form .select,
            form .file,
            form .checkbox {
                width: 98%;
                overflow: hidden;
                margin: .4em 0;
            }

            form div:not(.default) .no_translatable,
            form div:not(.default) .no_translatable,
            form div:not(.default) .no_translatable {
                visibility: hidden;
            }

            form .checkbox {
                margin: 1.5em 0;
            }

            form .icon-field {
                width: 100%;
                overflow: hidden;
                margin: .4em 0;
            }

            form .field-checkbox {
                overflow: hidden;
                margin: .4em 0;
            }

            form .permissions {
                border-bottom: 1px solid #666;
                margin-bottom: 1.2em;
                padding-bottom: .3em;
            }

            form textarea.textarea-values {
                color: #666;
                font-size: 1.4em;
                overflow: auto;
                width: 30em;
                height: 10em;
                position: relative;
                z-index: 1;
                border: 1px solid #ccc;
            }

                .field-checkbox label {
                    display: block;
                    font-weight: bold;
                    margin: 1em 0 .3em 0;
                }

                .field-checkbox p {
                    float: left;
                    margin: 0;
                    padding: 0;
                    width: 35%;
                    font-size: 1em;
                }

            form .field label,
            form .text label,
            form .select label,
            form .file label,
            form .checkbox label {
                display: block;
                margin: 1em 0 .3em 0;
                font-size: 1.5em;
                color: #333;
                font-weight: bold;
            }

                form .text label,
                form .select label {
                    clear: left;
                }

                form .checkbox label {
                    float: left;
                    margin-top: .2em;
                }

                form .field .field-error,
                form .text .error_message,
                form .select .error_message,
                form p.error_message {
                    color: #db2020;
                    font-size: 1.3em;
                }

                form .text .error_message,
                form .select .error_message {
                    float: left;
                    margin-top: .5em;
                    margin-bottom: .5em;
                }

                form .field input,
                form .text input {
                    padding: .5em;
                    border: 2px solid #555;
                    -webkit-border-radius: 3px;
                    -moz-border-radius: 3px;
                    border-radius: 3px;
                    width: 88%;
                    font-size: 1.4em;
                    border: 2px solid #555;
                    color: #333;
                    font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
                }

                form .checkbox input,
                form .checkbox input,
                form .field_type_5 {
                    float: left;
                    margin-right: .5em;
                    width: auto;
                }

                form .unzip-container {
                    float: left;
                    clear: left;
                }

                form input.unzip {
                    float: left;
                    width: auto;
                    display: inline-block;
                }

                form .unzip-container p {
                    float: left;
                    width: 90%;
                    display: inline-block;
                    margin: 0;
                }

			form .field input#filename,
            form .field input#file {
				width: 20em;
			}

			form .field textarea {
				width: 90.5%;
                height: 22em;
				font-size: 1.4em;
				border: 2px solid #555;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
				color: #333;
                padding: .5em;
				font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
			}

            #cms-object-types form .field select,
            #cms form .select select,
            #edit_page form .object-fields-short .field select {
                width: 20em;
            }

			form .field select,
            #cms form .select select {
				width: 70%;
				font-size: 1.4em;
				border: 2px solid #555;
				color: #333;
                padding: .5em;
                background-color: #fff;
                -webkit-border-radius: 3px;
                -moz-border-radius: 3px;
                border-radius: 3px;
                font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
			}


		/* Form object type fields */

		form .field label.field-position {
			float: left;
			margin: .3em 1em .2em 0;
			color: #333;
			font-weight:bold;
		}

		#fields {
			width: 100%;
			margin-top: 2em;
			overflow: hidden;
		}

			#fields .fields-block {
				float: left;
				width: 24em;
			}

			form fieldset .fields-block div.page_options {
				width: 90%;
				overflow: hidden;
				height: 3.5em;
			}

			#fields .main-fields-block {
				width: 73em;
			}

				#fields .fields-block p.first-block-name {
					padding-left: 1.7em;
				}

				#fields .fields-block .field-checkbox {
					float: left;
					width: 7em;
					margin: 0;
					padding-top: .4em;
                    font-size: 1.4em;
                    font-weight: bold;
				}

				#fields .fields-block .field-type {
					float: left;
					width: 25em;
                    margin-top: 0em;
				}

                #fields .fields-block .field-type.first {
                    margin-top: -2.3em;
                }

                    #fields .fields-block .field-type span {
                        font-size: 1.4em;
                        font-weight: bold;
                        margin-bottom: .7em;
                        float: left;
                        width: 100%;
                    }

                    #fields .fields-block .field-type select {
                        float: left;
                        margin-bottom: 0;
                        margin-right: .4em;
                    }

                    #fields .fields-block .field-type select.cmsobj-field-type-select {
                        width: 9em;
                    }

				#fields .fields-block .first {
					margin-top: -1.7em;
					padding: 0;
				}

				#fields .fields-block select {
/*                    width: 70%;*/
                    font-size: 1.4em;
                    border: 2px solid #555;
                    color: #333;
                    padding: .5em;
                    background-color: #fff;
                    -webkit-border-radius: 3px;
                    -moz-border-radius: 3px;
                    border-radius: 3px;
                    font-family: 'Varela Round', Verdana, Tahoma, Arial, sans-serif;
				}

		.form-obj-type-fields {
			width: 100%;
		}

			.form-obj-type-fields .field {
				width: 23em;
			}

			.form-obj-type-fields .field-icon {
				margin-top:1em;
				width:28em !important;
			}

                .form-obj-type-fields .field-icon input {
                    margin-top:1em;
                    float: left;
                    clear: left;
                }

            .form-obj-type-fields .field input {
                width: 70%;
            }

			img.cms-object-type-icon {
				float: left;
				margin-right: 2px;
			}

			.form-obj-type-fields #fields .main-fields-block .field {
				float: left;
				width: 17em;
				margin-right: 1em;
				clear: left;
			}

				.form-obj-type-fields .field input.language-field {
/*                    width: 97%;*/
                    margin: .3em 0;
				}

		#container #interior form div.object-fields-short {
			width: 100%;
			overflow: hidden;
			padding-bottom: 1em;
			border-bottom: 1px solid #999;
		}

			#container #interior form div.object-fields-short input {
				width: 20em;
			}

        #container #interior form.add-nodes-form {
            width: 100%;
            padding: 0;
            margin: 1em 0;
            overflow: hidden;
        }

        #container #interior ul.add-nodes {
            width: 100%;
            padding: 0;
            margin: 0;
            overflow: hidden;
        }

            #container #interior ul.add-nodes li {
                width: 100%;
                padding: .5em 0;
                margin: .5em 0;
                overflow: hidden;
                border-top: 1px solid #eee;
            }

                #container #interior ul.add-nodes li input,
                #container #interior ul.add-nodes li p,
                #container #interior ul.add-nodes li span {
                    float: left;
                }

                #container #interior ul.add-nodes li span {
                    margin: 0 2em 0 0;
                }

                #container #interior ul.add-nodes li span.cmsobjtype {
                    width: 20em;
                }

                #container #interior ul.add-nodes li p {
                    padding: 0;
                    margin: .2em 0 0 0;
                }




/* ? - Footer */

	#container #footer {
		height: 3em;
        margin-top: 2em;
		clear: both;
		width: 100%;
		overflow: hidden;
/*        border-top: 1px solid #ccc;*/
        background-color: #333;
	}

		#container #footer .right {
			float: right;
			padding: .3em 1em;
			font-size: 1.2em;
            color: #fff;
		}

			#container #footer .right a {
				text-decoration: none;
				color: #fff !important;
				padding-top: .3em;
				padding-bottom: .2em;
                font-weight: bold;
			}

				#container #footer .right a.powered_by:hover {
					text-decoration: underline;
				}