@import url(http://fonts.googleapis.com/css?family=Cuprum:400,700);

.mainmenu {
    color: #ffffff;
    font-family: 'Cuprum',Georgia,"Times New Roman",Times,Serif;
    font-size: 16px;
    height: 100px;
}

@media (max-width:750px) {
    .mainmenu {
        height: 114px;
    }
}

@media (max-width:410px) {
    .mainmenu {
        height: 171px;
    }
}

.mainmenu ul {margin: 0; padding: 0; }
.mainmenu li i { position: absolute; margin-left: -35px; margin-top: 6px;}
.mainmenu li { float: left; display: block; padding: 10px 10px 5px 45px; border-right: 1px solid #ffffff; /*cursor: pointer;*/ }
.mainmenu li:last-child{ border-right:none;}
.mainmenu li main {font-weight: 700; margin-top: -18px; }
.mainmenu li span { position: relative; float: left; font-size: 12px; color: #f5f7f8; }

.mainmenu li, .mainmenu li i, .mainmenu li main, .mainmenu li span {
    -moz-transition: all 0.8s ease-in-out;
    -o-transition: all 0.8s ease-in-out;
    transition: all 0.8s ease-in-out;
    -webkit-transition: all 0.8s ease-in-out;
}

.mainmenu li:hover main { 
	margin-left: 10px; 
   -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
}
.mainmenu li:hover span { 
	margin-left: 25px; 
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out;
}

/* COLOR MANAGEMENT */

.ccblue .mainmenu { background: none repeat scroll 0 0 #03B2EC;}
.ccblue .mainmenu li:hover { background: #044c64; }
.ccblue .mainmenu li:hover i {color: #ffffff;}
.ccblue .mainmenu li i { color: #044c64; }
.ccblue .mainmenu li:hover i {color: #ffffff;}

.ccred .mainmenu { background: none repeat scroll 0 0 #f00940;}
.ccred .mainmenu li:hover { background: #a30328; }
.ccred .mainmenu li i { color: #a30328; }
.ccred .mainmenu li:hover i {color: #ffffff;}

.ccgreen .mainmenu { background: none repeat scroll 0 0 #98c304;}
.ccgreen .mainmenu li:hover { background: #5e7902; }
.ccgreen .mainmenu li i { color: #5e7902; }
.ccgreen .mainmenu li:hover i {color: #ffffff;}

.cssbron .mainmenu { background: none repeat scroll 0 0 #af4004;}
.cssbron .mainmenu li:hover { background: #7c2e03; }
.cssbron .mainmenu li i { color: #7c2e03; }
.cssbron .mainmenu li:hover i {color: #ffffff;}

.cssblack .mainmenu { background: rgba(53, 152, 220, 0.51);}
.cssblack .mainmenu .active { background: rgb(53, 152, 220);}
.cssblack .mainmenu li:hover { background: rgb(53, 152, 220); }
.cssblack .mainmenu li i { color: #141414; }
.cssblack .mainmenu li:hover i {color: #ffffff;}