/*
Theme Name: Funworks Theme
Author: Vova Filatenko
Author URI: vovaf@addiedigital.com
Description: Funworks theme
Version: 1.1
*/


/********
   BEGIN PRIMARY STYLE
********/
html {
    font-size: 14px;
}
@font-face {
    font-family: 'Avenir-Book';
    src: url(fonts/Avenir-Book.eot);
    src: url(fonts/Avenir-Book.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-Book.woff) format('woff'), url(fonts/Avenir-Book.ttf) format('truetype'), url(fonts/Avenir-Book.svg), url(fonts/Avenir-Book.otf);
}
@font-face {
    font-family: 'Avenir-Black';
    src: url(fonts/Avenir-Black.eot);
    src: url(fonts/Avenir-Black.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-Black.woff) format('woff'), url(fonts/Avenir-Black.ttf) format('truetype'), url(fonts/Avenir-Black.svg), url(fonts/Avenir-Black.otf);
}
@font-face {
    font-family: 'Avenir-BlackOblique';
    src: url(fonts/Avenir-BlackOblique.eot);
    src: url(fonts/Avenir-BlackOblique.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-BlackOblique.woff) format('woff'), url(fonts/Avenir-BlackOblique.ttf) format('truetype'), url(fonts/Avenir-BlackOblique.svg), url(fonts/Avenir-BlackOblique.otf);
}
@font-face {
    font-family: 'Avenir-BookOblique';
    src: url(fonts/Avenir-BookOblique.eot);
    src: url(fonts/Avenir-BookOblique.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-BookOblique.woff) format('woff'), url(fonts/Avenir-BookOblique.ttf) format('truetype'), url(fonts/Avenir-BookOblique.svg), url(fonts/Avenir-BookOblique.otf);
}
@font-face {
    font-family: 'Avenir-Heavy';
    src: url(fonts/Avenir-Heavy.eot);
    src: url(fonts/Avenir-Heavy.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-Heavy.woff) format('woff'), url(fonts/Avenir-Heavy.ttf) format('truetype'), url(fonts/Avenir-Heavy.svg), url(fonts/Avenir-Heavy.otf);
}
@font-face {
    font-family: 'Avenir-HeavyOblique';
    src: url(fonts/Avenir-HeavyOblique.eot);
    src: url(fonts/Avenir-HeavyOblique.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-HeavyOblique.woff) format('woff'), url(fonts/Avenir-HeavyOblique.ttf) format('truetype'), url(fonts/Avenir-HeavyOblique.svg), url(fonts/Avenir-HeavyOblique.otf);
}
@font-face {
    font-family: 'Avenir-Light';
    src: url(fonts/Avenir-Light.eot);
    src: url(fonts/Avenir-Light.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-Light.woff) format('woff'), url(fonts/Avenir-Light.ttf) format('truetype'), url(fonts/Avenir-Light.svg), url(fonts/Avenir-Light.otf);
}
@font-face {
    font-family: 'Avenir-LightOblique';
    src: url(fonts/Avenir-LightOblique.eot);
    src: url(fonts/Avenir-LightOblique.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-LightOblique.woff) format('woff'), url(fonts/Avenir-LightOblique.ttf) format('truetype'), url(fonts/Avenir-LightOblique.svg), url(fonts/Avenir-LightOblique.otf);
}
@font-face {
    font-family: 'Avenir-Medium';
    src: url(fonts/Avenir-Medium.eot);
    src: url(fonts/Avenir-Medium.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-Medium.woff) format('woff'), url(fonts/Avenir-Medium.ttf) format('truetype'), url(fonts/Avenir-Medium.svg), url(fonts/Avenir-Medium.otf);
}
@font-face {
    font-family: 'Avenir-MediumOblique';
    src: url(fonts/Avenir-MediumOblique.eot);
    src: url(fonts/Avenir-MediumOblique.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-MediumOblique.woff) format('woff'), url(fonts/Avenir-MediumOblique.ttf) format('truetype'), url(fonts/Avenir-MediumOblique.svg), url(fonts/Avenir-MediumOblique.otf);
}
@font-face {
    font-family: 'Avenir-Oblique';
    src: url(fonts/Avenir-Oblique.eot);
    src: url(fonts/Avenir-Oblique.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-Oblique.woff) format('woff'), url(fonts/Avenir-Oblique.ttf) format('truetype'), url(fonts/Avenir-Oblique.svg), url(fonts/Avenir-Oblique.otf);
}
@font-face {
    font-family: 'Avenir-Roman';
    src: url(fonts/Avenir-Roman.eot);
    src: url(fonts/Avenir-Roman.eot?#iefix) format('embedded-opentype'), url(fonts/Avenir-Roman.woff) format('woff'), url(fonts/Avenir-Roman.ttf) format('truetype'), url(fonts/Avenir-Roman.svg), url(fonts/Avenir-Roman.otf);
}

@font-face {
    font-family: 'Raleway-Black';
    src: url(fonts/Raleway-Black.eot);
    src: url(fonts/Raleway-Black.eot?#iefix) format('embedded-opentype'), url(fonts/Raleway-Black.woff) format('woff'), url(fonts/Raleway-Black.ttf) format('truetype'), url(fonts/Raleway-Black.svg), url(fonts/Raleway-Black.otf);
}
@font-face {
    font-family: 'Raleway-ExtraBold';
    src: url(fonts/Raleway-ExtraBold.eot);
    src: url(fonts/Raleway-ExtraBold.eot?#iefix) format('embedded-opentype'), url(fonts/Raleway-ExtraBold.woff) format('woff'), url(fonts/Raleway-ExtraBold.ttf) format('truetype'), url(fonts/Raleway-ExtraBold.svg), url(fonts/Raleway-ExtraBold.otf);
}
@font-face {
    font-family: 'Raleway-ExtraBoldItalic';
    src: url(fonts/Raleway-ExtraBoldItalic.eot);
    src: url(fonts/Raleway-ExtraBoldItalic.eot?#iefix) format('embedded-opentype'), url(fonts/Raleway-ExtraBoldItalic.woff) format('woff'), url(fonts/Raleway-ExtraBoldItalic.ttf) format('truetype'), url(fonts/Raleway-ExtraBoldItalic.svg), url(fonts/Raleway-ExtraBoldItalic.otf);
}
@font-face {
    font-family: 'FontAwesome';
    src: url(fonts/fontawesome-webfont.eot);
    src: url(fonts/fontawesome-webfont.eot?#iefix) format('embedded-opentype'), url(fonts/fontawesome-webfont.woff) format('woff'), url(fonts/fontawesome-webfont.ttf) format('truetype'), url(fonts/fontawesome-webfont.svg), url(fonts/fontawesome-webfont.otf);
}
* {
 	margin: 0px;
 	padding: 0px;
    box-sizing: border-box;
}
input:-webkit-autofill {
    -webkit-box-shadow: 0 0 0 30px #091B3A inset;
    -webkit-text-fill-color: #FFB806 !important;
}
::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: rgba(255,255,255,.6);
}
::-moz-placeholder { /* Firefox 19+ */
  color: rgba(255,255,255,.6);
}
:-ms-input-placeholder { /* IE 10+ */
  color: rgba(255,255,255,.6);
}
:-moz-placeholder { /* Firefox 18- */
  color: rgba(255,255,255,.6);
}
a,a:hover,a:active,a:focus {
    transition: 1s;
    outline: none;
    text-decoration: none;
}
body h1,body h2,body h3, body h4, body h5, body h6 {
    margin-top: 0;
    margin-bottom: 0;
}
article,aside,details,figcaption,figure,footer,header,main,nav,section {
	display: block;
}
ol,ul {
	list-style: none;
}
button,button:hover,button:focus,button:active {
	border: none;
	background: none;
    outline: none;
    cursor: pointer;
}
.container {
    max-width: 1200px;
    width: 100%;
    padding: 0 10px;
    margin: auto;
}
.row {
    margin-left: -10px;
    margin-right: -10px;
}
.row:after {
    clear: both;
    content: '';
    display: block;
    height: 0;
}
.col-1 {
    width: calc(1 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-2 {
    width: calc(2 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-3 {
    width: calc(3 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-4 {
    width: calc(4 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-5 {
    width: calc(5 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-6 {
    width: calc(6 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-7 {
    width: calc(7 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-8 {
    width: calc(8 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-9 {
    width: calc(9 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-10 {
    width: calc(10 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-11 {
    width: calc(11 * 100% / 12);
    padding: 0 10px;
    float: left;
}
.col-12 {
    width: 100%;
    padding: 0 10px;
}
.offset-1 {
    margin-left: calc(1 * 100% / 12);
}
.offset-2 {
    margin-left: calc(2 * 100% / 12);
}
.offset-3 {
    margin-left: calc(3 * 100% / 12);
}
@media only screen and (min-width:771px) and (max-width: 1200px) {
    .col-m-1 {
        width: calc(1 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-2 {
        width: calc(2 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-3 {
        width: calc(3 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-4 {
        width: calc(4 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-5 {
        width: calc(5 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-6 {
        width: calc(6 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-7 {
        width: calc(7 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-8 {
        width: calc(8 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-9 {
        width: calc(9 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-10 {
        width: calc(10 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-11 {
        width: calc(11 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-m-12 {
        width: 100%;
        padding: 0 10px;
    }
}
@media only screen and (max-width: 770px) {
    .col-s-1 {
        width: calc(1 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-2 {
        width: calc(2 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-3 {
        width: calc(3 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-4 {
        width: calc(4 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-5 {
        width: calc(5 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-6 {
        width: calc(6 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-7 {
        width: calc(7 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-8 {
        width: calc(8 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-9 {
        width: calc(9 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-10 {
        width: calc(10 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-11 {
        width: calc(11 * 100% / 12);
        padding: 0 10px;
        float: left;
    }
    .col-s-12 {
        width: 100%;
        padding: 0 10px;
    }
}
h1,.h1 {
    font-family: 'Raleway-Black';
    font-size: 3.57rem;
    color: #fff;
    line-height: 4.5rem;
}
h2,.h2 {
    font-family: 'Raleway-Extrabold';
    font-size: 2.57rem;
    color: #fff;
    line-height: 3rem;
}
h3,.h3 {
    font-family: 'Raleway-Black';
    font-size: 2.14rem;
    line-height: 2.5rem;
    color: #fff;
}
h4,.h4 {
    font-family: 'Avenir-Black';
    font-size: 1.71rem;
    line-height: 2.35rem;
    color: #fff;    
}
.title {
    font-family: 'Avenir-Black';
    font-size: 1.28rem;
    color: #fff;
    line-height: 1.78rem;    
}
.subhead {
    font-family: 'Avenir-Black';
    font-size: 1.14rem;
    text-transform: uppercase;
    color: #fff;
    line-height: 1.35rem;
}
.link {
    font-family: 'Avenir-Black';
    font-size: 1rem;
    line-height: 1.35rem;
    text-transform: uppercase;
    color: #fff;
}
.link:hover {
    color: #FFE600;
}
.button {
    font-family: 'Avenir-Black';
    font-size: 1rem;
    color: #fff;
    text-transform: uppercase;
    line-height: 1.35rem;
}
.text-1 {
    font-family: 'Avenir-Medium';
    font-size: 1.28rem;
    line-height: 2.14rem;
    color: #fff;  
}
.text-2 {
    font-family: 'Avenir-Roman';
    font-size: 1.28rem;
    line-height: 2.14rem;
    color: #fff;  
}
.text-3 {
    font-family: 'Avenir-Roman';
    font-size: 1.14rem;
    line-height: 1.78rem;
    color: #fff;  
}
.note {
    font-family: 'Avenir-Oblique';
    font-size: 1rem;
    line-height: 1.35rem;
    color: #4798E4;
}
.butt-1, .butt-2, .butt-3 {
    border-radius: 26px;    
    padding: 16px 52px;
    font-size: 1rem;
    line-height: 1.35rem;
    font-family: 'Avenir-Black';
    text-transform: uppercase;
    display: inline-block;
}
.butt-1 {
    background: #FFE600;
    border: 1px solid #FFE600;
    color: #051841;
}
.butt-1:hover {
    background: #FFFF28;
    border: 1px solid #FFFF28;
}
.butt-2 {
    background: #418BD0;
    border: 1px solid #418BD0;
    color: #fff;
}
.butt-2:hover {
    background: #439AEB;
    border: 1px solid #439AEB;
}
.butt-3 {
    background: transparent;
    border: 2px solid #FFE600;
    color: #FFE600;
}
.butt-3:hover {
    background: #FFFF28;
    border: 2px solid #FFFF28;
    color: #051841;
}
/********
   END PRIMARY STYLE
********/