/*! HTML5 Boilerplate v5.0.0 | MIT License | http://h5bp.com/ */
/*
Template Name: comingwa
Author: Lotta Bergman
Version: 1.0.0

 */
/**
 * ============================================================================
 * Table of Contents
 * -----------------------------------------------------------------------
 * #Base styles: opinionated defaults
 * #Author Custom Style
 *      1.Author Custom Global Style
 *         2.Intro Section
 *         2.1.FullScreen Image
 *         2.2.Intro Content
 *         2.2.1.Logo
 *         2.2.2.Intro Main Heading
 *         2.2.4.Intro Sub Heading
 *         2.2.5.Trigger Button with SVG
 *         2.2.6.Social Links                
 *         3.Trigger After Content
 *         3.1.Trigger Notify
 *         3.2.Our Service
 *         3.3.Our Awesome Team
 *         3.4.Contact Form
 *         3.5.Google Map
 *         3.6.Footer         
 *     #Helper classes
 *     #Responsive Style
 *     #Screen loader
 *     #Preloader
 *    
 * ============================================================================
 */
/* ==========================================================================
   Base styles: opinionated defaults
   ========================================================================== */
html {
    color: #bfbfbf;
    font-size: 1em;
    line-height: 1.4;
}
/*
 * Remove text-shadow in selection highlight:
 * https://twitter.com/miketaylr/status/12228805301
 *
 * These selection rule sets have to be separate.
 * Customize the background color to match your design.
 */
::-moz-selection {
    background: #b3d4fc;
    text-shadow: none;
}
::selection {
    background: #b3d4fc;
    text-shadow: none;
}
/*
 * A better looking default horizontal rule
 */
hr {
    display: block;
    height: 1px;
    border: 0;
    border-top: 1px solid #ccc;
    margin: 1em 0;
    padding: 0;
}
/*
 * Remove the gap between audio, canvas, iframes,
 * images, videos and the bottom of their containers:
 * https://github.com/h5bp/html5-boilerplate/issues/440
 */
audio,
canvas,
iframe,
img,
svg,
video { vertical-align: middle }
/*
 * Remove default fieldset styles.
 */
fieldset {
    border: 0;
    margin: 0;
    padding: 0;
}
/*
 * Allow only vertical resizing of textareas.
 */
textarea { resize: vertical }
/* ==========================================================================
   Browser Upgrade Prompt
   ========================================================================== */
.browserupgrade {
    margin: 0.2em 0;
    background: #ccc;
    color: #000;
    padding: 0.2em 0;
}
/* 
* ==========================================================================
   
  ================= 1.Fonter  ===========================
* ========================================================================== 
*/


.square_reg{ 
 	font-family: "square-peg", sans-serif;
	font-weight: 400;
	font-style: normal;
}

.sofia_reg{
	font-family: "sofia-pro-soft", sans-serif;
	font-weight: 400;
	font-style: normal;
}

.sofia_bold{
    font-family: "sofia-pro-soft", sans-serif;
	font-weight: 700;
	font-style: normal;
}
.sofia_light{
 	font-family: "sofia-pro-soft", sans-serif;
	font-weight: 300;
	font-style: normal;
}


h3, .rod_text {
    color: #ff8383;
}

.lightteal_background{
    background-color: #C4FFF7
}

.teal_background {
    
    background-color: #22babb;
}
.black_background {
    
    background-color: #000000;
}
.white_background {
    
    background-color: #ffffff;
}

.lightorange_background {
    background-color: #ffb166;

  
}

.lightteal {
     color: #C4FFF7;
}
.lightorange {
    color: #ffb166;


  
}
.orange_background {
        background-color: #FA7F08;

  
}
.white
{
	color: white;
}

.black
{
	color: black;
}

.rod {
    border-radius: 50%;
    padding: 40px;
    background-color: #bebebe;
    width: 100%;
    height: 100%;
}



.vrid {
    transform: rotate(-5deg);
}

p {
	font-family: "sofia-pro-soft", sans-serif;
	font-style: normal;
    font-weight: 300;
    font-size: 20px;
}


/* 
* ==========================================================================
    =========+++++++++++++++ 2.Intro Section +++++++++++++++=============
* ==========================================================================
*/


/* 
* ==========================================================================
        2.2.1.Logo - Rallyslingan fältet längst upp
* ==========================================================================
*/




.feature img {
    display: block;
    width: 100%;
}

.platta_pre {
    padding-bottom: 100%; /* ratio:1:1*/
    
}


.platta {
    
    padding: 10px;
    margin-top: 20px;
    border-radius: 15px;
    background-color: #ffffff;
    width: 50%;
}

.text-logo h2{
    opacity: 0.;
    letter-spacing: 1px;
    font-size: 40px;
}

.apple_google a img{
    width: 75%;
    display: block;
    
}

.ruta {
    padding: 30px;
}



.megafon_rad {
    margin-top: 50px;
}

.rubrikfarg {
    color:#fff252;
}



/* 
* ==========================================================================
        xxx
* ========================================================================== 
*/



/* 

* ==========================================================================
    Responsive Design
* ========================================================================== 
*/




@media (max-width: 576px) { 

    .osynlig { display: none;}

}

/*
@media only screen and (max-width: 767px) { 
    .text-justify { text-align: center }
}

@media only screen and (max-width: 480px) { 
    .intro { position: absolute }
    .logo { margin: -55px 0 25px }
    .text-logo {
        font-size: 2em;
        margin: 0;
    }
    .intro-title {
        font-size: 1.5em;
        margin: 8px 0;
    }
   
}

@media only screen and (max-width: 304px) { 
    body{background:#69C238} 
    .intro { position: absolute }
    
}



@media only screen and (max-width: 320px) { 
    .intro { position: absolute }
    .text-logo {
        font-size: 3em;
        margin: 0;
    }
    .intro-title {
        font-size: 1.3em;
        margin: 5px 0 10px;
    }
    
    
}
@media only screen and (min-width: 238px) and (max-width: 319px) { 
    .intro { position: absolute }
    .logo { margin: -60px 0 25px }
    .text-logo { margin: -60px 0 0 }
    .intro-title {
        font-size: 1em;
        margin: -25px 0 5px;
    }
    .intro-subtitle p {margin-top:5px;}
    .intro-subtitle { margin: -5px 0 0 }
  
}
@media only screen and (min-width: 481px) and (max-width: 568px) { 
    .intro { position: absolute }
    .intro-content { padding: 2% }
    .logo { margin: -60px 0 25px }
    .text-logo {
        font-size: 2em;
        margin: -25px 0 5px;
    }
    .intro-title {
        font-size: 2em;
        margin: -20px 0 15px;
    }
    .intro-subtitle p {margin-top:5px;}
    
    
   
}
@media only screen and (min-width: 569px) and (max-width: 736px) { 
    .intro { position: absolute }
    .logo { margin: 0 0 20px }
    .text-logo { margin: -60px 0 0 }
    .intro-subtitle p {margin-top:20px;}
    .intro-title {
        font-size: 2em;
        margin: -0px 0 15px;
    }
    
    .intro-subtitle { margin: -15px 0 0 }
    
    
}
@media only screen and (min-width: 768px) and (max-width:991px) { 
    .intro-title { font-size: 3em }
    .container-open .notify-after { left: 34% }
}

@media print, (-o-min-device-pixel-ratio: 5/4), (-webkit-min-device-pixel-ratio: 1.25), (min-resolution: 120dpi) { 
  
}
*/