/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

 * Stylesheet: styles
 * Clean Project v1.1
 * Autor / Author: Quickin - info@quickin.co
 * You'll find some initial styles for UI elements. You should import your Google Fonts files here too.

 *  * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

@import url('https://fonts.googleapis.com/css?family=Oswald:700|Poppins');

/*This selector fixes default blue colors on <a> tags */
a
{
	color:inherit;
}
/* Sometimes, you need to include some general attributes to body element. Please, put your main font-family here */
body
{
    color:#4A4A4A;
    font-family: 'Poppins', sans-serif;
    font-weight: 400;
}

/* .font2 class  was created to include your second font-family */
.font2
{
    color:#0C2F80;
	font-family: 'Oswald', sans-serif;
    font-weight: 700;
    text-transform: uppercase;
}
/* Every 100% element should have .outter class.*/
.outter
{
	width:100%;
}

/* Every save zone container should have .container class */
.container
{
    box-sizing: border-box;
	margin:0 auto;
	position:relative;
	max-width:687px;
    width:100%;
}
/* Every float content container must be used with .clean class for fixing auto height issues */
.clear::after
{
	content:"";
	clear:both;
	display:block;
}
/* If you want to turn an <a> tag on a new block element, you can use .replaced_text. This class makes a left-indent to inner texts */
.replaced_text
{
	display:block;
	text-indent:-9999px;
}
/* Use .basic_background class when you need to use background images covering an entire element. Every basic_background elements must contain a hidden <img> element for SEO benefits */
.basic_background{
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
	}

/*This class helps to create display:none; elements easiest than before */
.displaynone{
	display:none;
}

/* basic scrollbar styling */
/* vertical scrollbar */
.mCSB_container{
width:auto;
overflow:hidden;
}
.mCSB_container.mCS_no_scrollbar{
margin-right:0;
}
.mCustomScrollBox .mCSB_scrollTools{
    height: 100%;
    right: 0;
    top: 0;
    width: 6px;
}
.mCSB_scrollTools .mCSB_draggerContainer{
height:100%;
}
.mCSB_scrollTools .mCSB_buttonUp+.mCSB_draggerContainer{
}
.mCSB_scrollTools .mCSB_draggerRail{
	border-radius:0;
	width:1px;
	height:100%;
	margin:0 auto;
}
.mCSB_scrollTools .mCSB_dragger{
cursor:pointer;
width:100%;
height:30px;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width:4px;
height:100%;
margin:0 auto;
border-radius:5px;
text-align:center;
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown{
height:20px;
overflow:hidden;
margin:0 auto;
cursor:pointer;
}
.mCSB_scrollTools .mCSB_buttonDown{
bottom:0;
margin-top:-40px;
}
/* horizontal scrollbar */
.mCSB_horizontal .mCSB_container{
height:auto;
margin-right:0;
margin-bottom:30px;
overflow:hidden;
}
.mCSB_horizontal .mCSB_container.mCS_no_scrollbar{
margin-bottom:0;
}
.mCSB_horizontal.mCustomScrollBox .mCSB_scrollTools{
width:100%;
height:16px;
top:auto;
right:auto;
bottom:0;
left:0;
overflow:hidden;
}
.mCSB_horizontal .mCSB_scrollTools .mCSB_draggerContainer{
height:100%;
width:auto;
overflow:hidden;
}
.mCSB_horizontal .mCSB_scrollTools .mCSB_buttonLeft+.mCSB_draggerContainer{
padding-bottom:0;
padding-right:20px;
}
.mCSB_horizontal .mCSB_scrollTools .mCSB_draggerRail{
width:100%;
height:2px;
margin:7px 0;
}
.mCSB_horizontal .mCSB_scrollTools .mCSB_dragger{
width:30px;
height:100%;
}
.mCSB_horizontal .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
width:100%;
height:4px;
margin:6px auto;
}
.mCSB_horizontal .mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_horizontal .mCSB_scrollTools .mCSB_buttonRight{
width:20px;
height:100%;
overflow:hidden;
margin:0 auto;
cursor:pointer;
float:left;
}
.mCSB_horizontal .mCSB_scrollTools .mCSB_buttonRight{
right:0;
bottom:auto;
margin-left:-40px;
margin-top:-16px;
float:right;
}
/* default scrollbar colors and backgrounds */
.mCustomScrollBox .mCSB_scrollTools{
}
.mCustomScrollBox:hover .mCSB_scrollTools{
}
.mCSB_scrollTools .mCSB_draggerRail{
background:#CCC;
}
.mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{
background:#999;
}
.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{
background:#999;
}
.mCSB_scrollTools .mCSB_dragger:active .mCSB_dragger_bar,
.mCSB_scrollTools .mCSB_dragger.mCSB_dragger_onDrag .mCSB_dragger_bar{
background:#999;
}
.mCSB_scrollTools .mCSB_buttonUp,
.mCSB_scrollTools .mCSB_buttonDown,
.mCSB_scrollTools .mCSB_buttonLeft,
.mCSB_scrollTools .mCSB_buttonRight{
background-image:url(mCSB_buttons.png);
background-repeat:no-repeat;
}
.mCSB_scrollTools .mCSB_buttonUp{
background-position:0 0;
/*
sprites locations are 0 0/-16px 0/-32px 0/-48px 0 (light) and -80px 0/-96px 0/-112px 0/-128px 0 (dark)
*/
}
.mCSB_scrollTools .mCSB_buttonDown{
background-position:0 -20px;
/*
sprites locations are 0 -20px/-16px -20px/-32px -20px/-48px -20px (light) and -80px -20px/-96px -20px/-112px -20px/-128px -20px (dark)
*/
}
.mCSB_scrollTools .mCSB_buttonLeft{
background-position:0 -40px;
/*
sprites locations are 0 -40px/-20px -40px/-40px -40px/-60px -40px (light) and -80px -40px/-100px -40px/-120px -40px/-140px -40px (dark)
*/
}
.mCSB_scrollTools .mCSB_buttonRight{
background-position:0 -56px;
/*
sprites locations are 0 -56px/-20px -56px/-40px -56px/-60px -56px (light) and -80px -56px/-100px -56px/-120px -56px/-140px -56px (dark)
*/
}
.mCSB_scrollTools .mCSB_buttonUp:hover,
.mCSB_scrollTools .mCSB_buttonDown:hover,
.mCSB_scrollTools .mCSB_buttonLeft:hover,
.mCSB_scrollTools .mCSB_buttonRight:hover{
}
.mCSB_scrollTools .mCSB_buttonUp:active,
.mCSB_scrollTools .mCSB_buttonDown:active,
.mCSB_scrollTools .mCSB_buttonLeft:active,
.mCSB_scrollTools .mCSB_buttonRight:active{
} 


/*Basic UI selectmenu Styles*/
.ui-menu
{
	font-size:1.5em;
	color:#DEB767;
	letter-spacing:1px;
	

}
.ui-menu .ui-menu-item
{
	background:#111;
	color:#FFF;
}
.ui-menu .ui-menu-item div
{
	padding-left:20px;
}
.ui-menu .ui-menu-item .ui-state-active
{
	background:#DEB767;
	color:#111;
}
.ui-selectmenu-button
{
	border:1px solid #DEB767;
	color:#DEB767;
	font-weight:400;
	font-size:1.4em;
	letter-spacing:1px;
}
.ui-selectmenu-button .ui-selectmenu-icon
{
	box-sizing:border-box;
	color:#FFF;
	height:15px;
	position:relative;
	top:3px;
	width:15px;
}
.ui-selectmenu-button .ui-selectmenu-icon::after
{
	
}
.ui-selectmenu-button-closed .ui-selectmenu-icon
{
	
}
.ui-selectmenu-button-open .ui-selectmenu-icon
{
	transform:scale(1,-1);
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active
{
    background:#FFF;
    border:2px solid #CCC;
    border-radius:0;
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus
{
    background:#FFF;
    border:2px solid #CCC;
    border-radius:0;
}
/* END of Basic UI selectmenu Styles*/

/*Column system based on %*/
.bigcolumn
{
    box-sizing: border-box;
    float:left;
}
.w_5
{
    width:5%;
}
.w_10
{
    width:10%;
}
.w_20
{
    width:20%;
}
.w_25
{
    width:25%;
}
.w_30
{
    width:30%;
}
.w_33
{
    width:33%;
}
.w_35
{
    width:35%;
}
.w_40
{
    width:40%;
}
.w_45
{
    width:45%;
}
.w_50
{
    width:50%;
}
.w_55
{
    width:55%;
}
.w_60
{
    width:60%;
}
.w_65
{
    width:65%;
}
.w_70
{
    width:70%;
}
.w_75
{
    width:75%;
}
.w_80
{
    width:80%;
}
.w_85
{
    width:85%;
}
.w_90
{
    width:90%;
}
.w_95
{
    width:95%;
}
@media screen and (max-width:768px)
{
    .w_5,.w_10,.w_15,.w_20,.w_25,.w_30,w_33,.w_35,.w_40,.w_45,.w_50,.w_55,.w_60,.w_65,.w_70.w_75,.w_80,.w_85,.w_90,.w_95
    {
        width:100%;
    }
}
/* * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * *

 * Stylesheet: styles
 * Clean Project v1.1
 * Autor / Author: Quickin - info@quickin.co
 * Use this file to write your custom styles

 *  * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * * */

.container
{
    
    padding:0 10px;
}

figure
{
    max-width:800px;
    margin:0 auto;
}
h3
{
    font-size:1.4em;
        margin: 40px auto;
    text-align: center;
}
form.container
{
    padding-bottom:70px;
    text-align: center;
}
form p,form h4
{
    text-align: left;
}
form h4
{
    font-size:1.4em;
    margin-bottom:35px;
}
form p 
{
    font-size:1.6em;
    margin-bottom:27px;
    position:relative;
}
form h1
{
    font-size:4em;
    margin-bottom:50px;
}
form button
{
    font-size:1.8em;
}
form label
{
    display:block;
    margin-bottom: 12px;
}
form input
{
    border:1px solid #CCCCCC;
    box-sizing: border-box;
    font-size:0.875em;
    padding:8px 14px;
}
form input.error
{
   border:1px solid #E2574C;
   color:#E2574C;
   position:relative;
}
form input.error
{
    background:url(../images/error-icon.svg) no-repeat 98% center;
    background-size:20px;

}
form label.error
{
   color:#E2574C;
font-size:0.8em;
}
form button
{
    background:#FFEC00;
    border-radius:30px;
    display:inline-block;
    padding:15px 26px;
}


#mask {
  position:absolute;
  z-index:9000;
  background-color:#000;
  display:none;
}
  
#boxes .window {
  position:fixed;
  width:440px;
  height:200px;
  display:none;
  z-index:9999;
  padding:20px;
}


/* Customize your modal window here, you can add background image too */
#boxes #dialog {
  width:375px; 
  height:203px;
}