@media screen and (min-width: 961px) and (max-width: 1880px) {

    .container {
        width: 1200px;
    }

}

@media screen and (min-width: 961px) and (max-width: 1620px) {

    .container {
        width: 960px;
    }

}

@media screen and (min-width: 961px) and (max-width: 1320px) {

    .container {
        width: 100%;
    }

}

@media screen and (max-width: 960px) {

    .container {
        width: 100%;
    }

}

@media screen and (max-width: 736px) {

    .container {
        width: 100%;
    }

}

.row > * {
    box-sizing: border-box;
}

.row.gtr-uniform > * > :last-child {
    margin-bottom: 0;
}

.row.aln-left {
    justify-content: flex-start;
}

.row.aln-center {
    justify-content: center;
}

.row.aln-right {
    justify-content: flex-end;
}

.row.aln-top {
    align-items: flex-start;
}

.row.aln-middle {
    align-items: center;
}

.row.aln-bottom {
    align-items: flex-end;
}

.row > .imp {
    order: -1;
}

.row > .col-1 {
    width: 8.3333333333%;
}

.row > .off-1 {
    margin-left: 8.3333333333%;
}

.row > .col-2 {
    width: 16.6666666667%;
}

.row > .off-2 {
    margin-left: 16.6666666667%;
}

.row > .col-3 {
    width: 25%;
}

.row > .off-3 {
    margin-left: 25%;
}

.row > .col-4 {
    width: 33.3333333333%;
}

.row > .off-4 {
    margin-left: 33.3333333333%;
}

.row > .col-5 {
    width: 41.6666666667%;
}

.row > .off-5 {
    margin-left: 41.6666666667%;
}

.row > .col-6 {
    width: 50%;
}

.row > .off-6 {
    margin-left: 50%;
}

.row > .col-7 {
    width: 58.3333333333%;
}

.row > .off-7 {
    margin-left: 58.3333333333%;
}

.row > .col-8 {
    width: 66.6666666667%;
}

.row > .off-8 {
    margin-left: 66.6666666667%;
}

.row > .col-9 {
    width: 75%;
}

.row > .off-9 {
    margin-left: 75%;
}

.row > .col-10 {
    width: 83.3333333333%;
}

.row > .off-10 {
    margin-left: 83.3333333333%;
}

.row > .col-11 {
    width: 91.6666666667%;
}

.row > .off-11 {
    margin-left: 91.6666666667%;
}

.row > .col-12 {
    width: 100%;
}

.row > .off-12 {
    margin-left: 100%;
}

.row.gtr-0 {
    margin-top: 0px;
    margin-left: 0px;
}

    .row.gtr-0 > * {
        padding: 0px 0 0 0px;
    }

    .row.gtr-0.gtr-uniform {
        margin-top: 0px;
    }

        .row.gtr-0.gtr-uniform > * {
            padding-top: 0px;
        }

.row.gtr-25 {
    margin-top: -10px;
    margin-left: -10px;
}

    .row.gtr-25 > * {
        padding: 10px 0 0 10px;
    }

    .row.gtr-25.gtr-uniform {
        margin-top: -10px;
    }

        .row.gtr-25.gtr-uniform > * {
            padding-top: 10px;
        }

.row.gtr-50 {
    margin-top: -20px;
    margin-left: -20px;
}

    .row.gtr-50 > * {
        padding: 20px 0 0 20px;
    }

    .row.gtr-50.gtr-uniform {
        margin-top: -20px;
    }

        .row.gtr-50.gtr-uniform > * {
            padding-top: 20px;
        }

        .row > * {
            padding: 40px 0 0 40px;
        }

        .row.gtr-uniform {
            margin-top: -40px;
        }

            .row.gtr-uniform > * {
                padding-top: 40px;
            }

    .row.gtr-150 {
        margin-top: -60px;
        margin-left: -60px;
    }

        .row.gtr-150 > * {
            padding: 60px 0 0 60px;
        }

        .row.gtr-150.gtr-uniform {
            margin-top: -60px;
        }

            .row.gtr-150.gtr-uniform > * {
                padding-top: 60px;
            }

    .row.gtr-200 {
        margin-top: -80px;
        margin-left: -80px;
    }

        .row.gtr-200 > * {
            padding: 80px 0 0 80px;
        }

        .row.gtr-200.gtr-uniform {
            margin-top: -80px;
        }

            .row.gtr-200.gtr-uniform > * {
                padding-top: 80px;
            }
    
            section > :last-child,
            section > .container, section:last-child, article > :last-child,
            article > .container, article:last-child {
                margin-bottom: 0;
            }
    
            .row > section, .row > article {
                margin-bottom: 0;
            }

            .image img {
                display: block;
                width: 100%;
            }
    
            .image.avatar48 {
                width: 48px;
                height: 48px;
                background: rgb(20, 176, 204);
            }
    
                .image.avatar48 img {
                    width: 48px;
                    height: 48px;
                }
    
            .image.fit {
                display: block;
                width: 100%;
            }
    
            .image.featured {
                display: block;
                width: 100%;
                margin: 0 0 2em 0;
            }

            .image.centered {
                display: block;
                margin: 0 0 2em 0;
            }
    
                .image.centered img {
                    margin: 0 auto;
                    width: auto;
                }

                ul li {
                    padding-left: 0.5em;
                }
                
		ol li {
			padding-left: 0.25em;
        }
        
        
	ul.icons {
		cursor: default;
		list-style: none;
		padding-left: 0;
	}

		ul.icons li {
			display: inline-block;
			padding-left: 0;
		}

		ul.icons a {
			display: inline-block;
			width: 2em;
			height: 2em;
			line-height: 2em;
			text-align: center;
			border: 0;
        }
        
        form label {
            display: block;
            text-align: left;
            margin-bottom: 0.5em;
        }

        .item header {
			background: #fff;
			margin: 0;
			padding: 1em 0 1em 0;
			font-size: 0.8em;
		}

			.item header h3 {
				font-size: 1em;
            }
            
            .icon:before {
                display: inline-block;
                font-family: FontAwesome;
                font-size: 1.25em;
                text-decoration: none;
                font-style: normal;
                font-weight: normal;
                line-height: 1;
                -webkit-font-smoothing: antialiased;
                -moz-osx-font-smoothing: grayscale;
            }
    
            .icon > .label {
                display: none;
            }

            
		#header .top {
			-moz-flex-grow: 1;
			-webkit-flex-grow: 1;
			-ms-flex-grow: 1;
			flex-grow: 1;
		}

		#header .bottom {
			-moz-flex-shrink: 0;
			-webkit-flex-shrink: 0;
			-ms-flex-shrink: 0;
			flex-shrink: 0;
			padding: 1.5em 0 0.75em 0;
		}

			#header .bottom > :last-child {
				margin-bottom: 0;
			}

		#header .icons {
			font-size: 0.8em;
			text-align: center;
		}

			#header .icons a {
				color: #e955c9;
				-moz-transition: color 0.35s ease-in-out;
				-webkit-transition: color 0.35s ease-in-out;
				-ms-transition: color 0.35s ease-in-out;
				transition: color 0.35s ease-in-out;
			}

				#header .icons a:hover {
					color: #fff;
                }

                #nav ul li {
                    padding-left: 0;
                }
        
                    #nav ul li a {
                        display: block;
                        padding: 0.5em 1.5em 0.5em 1.5em;
                        color: rgba(255, 255, 255, 0.5);
                        text-decoration: none;
                        outline: 0;
                        border: 0;
                        -moz-transition: none;
                        -webkit-transition: none;
                        -ms-transition: none;
                        transition: none;
                    }

                    #nav ul li a.active {
                        background: rgba(0, 0, 0, 0.15);
                        box-shadow: inset 0 0 0.25em 0 rgba(0, 0, 0, 0.125);
                        color: #fff;
                    }
    
                        #nav ul li a.active span:before {
                            color: #e27689;
                        }

        #footer .copyright li {
            display: inline-block;
            line-height: 1em;
            border-left: solid 1px rgba(128, 128, 128, 0.35);
            padding: 0 0 0 0.5em;
            margin: 0 0 0 0.5em;
        }

        #footer .copyright {
            cursor: default;
            margin: 0;
        }

        
        #footer .copyright li:first-child {
            border-left: 0;
            padding-left: 0;
            margin-left: 0;
        }

        #main > section.dark {
            color: #ddd;
            color: rgba(255, 255, 255, 0.75);
        }

        	#main > section.dark h2, #main > section.dark h3, #main > section.dark h4, #main > section.dark h5, #main > section.dark h6 {
					color: inherit;
                }
                
                #main > section.dark strong {
					color: #fff;
					border-color: inherit;
                }
                
                
				#main > section.dark a {
					color: #fff;
					border-color: inherit;
				}
                #main > section.two {
                    background-color: #f5fafa;
                }
    
                #main > section.three {
                    background-color: #ecf1f1;
                }
    
                #main > section.four {
                    background-color: #e8edec;
                }

                


/* Normal */

@media screen and (min-width: 961px) and (max-width: 1620px) {

    /* Main */

        #main > section {
            padding: 3em 0;
        }

        #main section.cover {
            padding: 5em 0;
        }

}

/* Narrow */

@media screen and (min-width: 961px) and (max-width: 1320px) {

    /* Basic */

        body, input, textarea, select {
            font-size: 16pt;
        }

        .container {
            padding: 0 2em 0 2em;
        }

    /* Icons */

        ul.icons li a {
            width: 1.75em;
        }

    /* Item */

        .item {
            margin-bottom: 20px;
        }

    /* Header */

        #header {
            width: 20%;
        }

        #logo .image {
            position: relative;
            margin: 0 0 0.5em 0;
        }

        #nav ul li a {
            font-size: 0.8em;
            padding-top: 0.5em;
            padding-bottom: 0.5em;
        }

            #nav ul li a span {
                padding-right: 2.25em;
            }

                #nav ul li a span:before {
                    left: 100%;
                    margin-left: -1.25em;
                    line-height: 2.25em;
                }

    /* Footer */

        #footer {
            margin-left: 20%;
        }

    /* Main */

        #main {
            margin-left: 20%;
        }

} 


@media screen and (max-width: 960px) {

    /* Basic */

        html, body {
            overflow-x: hidden;
        }

        body, input, textarea, select {
            font-size: 16pt;
        }

        header br {
            display: none;
        }

        .container {
            padding: 0 2em 0 2em;
        }

    /* Item */

        .item {
            margin-bottom: 15px;
        }

    /* Icons */

        ul.icons a {
            width: 1.75em;
            font-size: 1.25em;
        }

    /* Header */

        #header {
            -moz-backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            backface-visibility: hidden;
            -moz-transform: translateX(-275px);
            -webkit-transform: translateX(-275px);
            -ms-transform: translateX(-275px);
            transform: translateX(-275px);
            -moz-transition: -moz-transform 0.5s ease;
            -webkit-transition: -webkit-transform 0.5s ease;
            -ms-transition: -ms-transform 0.5s ease;
            transition: transform 0.5s ease;
            -webkit-overflow-scrolling: touch;
            display: block;
            height: 100%;
            left: 0;
            overflow-y: auto;
            position: fixed;
            top: 0;
            width: 275px;
            z-index: 10002;
            width: 275px;
            background: #222729 url("images/overlay.png");
            box-shadow: inset -0.25em 0 0.25em 0 rgba(0, 0, 0, 0.125);
        }

            #header .top {
                position: relative;
            }

            #header .bottom {
                border-top: solid 1px rgba(255, 255, 255, 0.05);
                box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.15);
                padding-top: 2em;
                margin-top: 2em;
                position: relative;
            }

        #logo {
            margin: 1.5em 1.25em 1.25em 1.25em;
        }

        #nav ul li a {
            padding: 0.5em 1.25em 0.5em 1.25em;
        }

        #headerToggle {
            -moz-backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            backface-visibility: hidden;
            -moz-transition: -moz-transform 0.5s ease;
            -webkit-transition: -webkit-transform 0.5s ease;
            -ms-transition: -ms-transform 0.5s ease;
            transition: transform 0.5s ease;
            display: block;
            height: 2.25em;
            left: 0;
            position: fixed;
            top: 0;
            width: 3.25em;
            z-index: 10001;
        }

            #headerToggle .toggle {
                position: absolute;
                left: 0;
                top: 0;
                width: 100%;
                height: 100%;
                outline: 0;
                border: 0;
            }

                #headerToggle .toggle:before {
                    font-family: FontAwesome;
                    text-decoration: none;
                    font-style: normal;
                    font-weight: normal;
                    -webkit-font-smoothing: antialiased;
                    -moz-osx-font-smoothing: grayscale;
                    content: '\f0c9';
                    color: #fff;
                    font-size: 18px;
                    line-height: 2.25em;
                    background: rgba(128, 136, 144, 0.5);
                    border-radius: 0.35em;
                    text-align: center;
                    position: absolute;
                    left: 0.5em;
                    top: 0.5em;
                    display: block;
                    width: 3.25em;
                    height: 2.25em;
                    line-height: 2.25em;
                }

        body.header-visible #main {
            -moz-transform: translateX(275px);
            -webkit-transform: translateX(275px);
            -ms-transform: translateX(275px);
            transform: translateX(275px);
        }

        body.header-visible #headerToggle {
            -moz-transform: translateX(275px);
            -webkit-transform: translateX(275px);
            -ms-transform: translateX(275px);
            transform: translateX(275px);
        }

        body.header-visible #header {
            -moz-transform: translateX(0);
            -webkit-transform: translateX(0);
            -ms-transform: translateX(0);
            transform: translateX(0);
        }

    /* Footer */

        #footer {
            margin-left: 0;
        }

    /* Main */

        #main {
            -moz-backface-visibility: hidden;
            -webkit-backface-visibility: hidden;
            -ms-backface-visibility: hidden;
            backface-visibility: hidden;
            -moz-transition: -moz-transform 0.5s ease;
            -webkit-transition: -webkit-transform 0.5s ease;
            -ms-transition: -ms-transform 0.5s ease;
            transition: transform 0.5s ease;
            padding-bottom: 1px;
            margin-left: 0;
        }

            #main > section {
                padding: 3em 0;
            }

            #main section.cover {
                padding: 4em 0;
            }

}